/* CSS･スタイルシート質問スレッド【42】 */

WinXPSP2 / Firefox1 / HTML,CSS共にUTF-8で記述

font-family;monospace;

で文字が一回り小さくなるのは仕様ですか？
IEでは100%のフォントサイズで表示されるんですが・・・。

IEとFirefoxとで、異なるフォントで表示されてるんでないかい。

>>250
フォントの設定見てみ

IEって

<div>...</div>
こう記述するか

<div>
...
</div>
こう記述するかで表示が変わるので困る。
本来はどうするべき？

body内すべて改行無しで書けばいいやん。　な？

やだ

<div
><anytag>…</anytag
><div>

ってすることはままあるな。

<table><tr>
<td bgcolor="#000000" onmouseover="this.style.backgroundColor='#ffffff';this.color='#000000'" onmouseout="this.style.backgroundColor='#000000';this.color='#ffffff'">
aaaa</td></tr></table>
現在こんな感じなのですが
テーブルにカーソルを合わせた時背景だけでなく同時に文字色も変えたいのですが
どの様にすれば良いのでしょうか?
スレ違い等であれば該当スレを言ってくれれば幸いです(´・ω・｀)

this.color

IFRAMEを中央にするにはどうしたらいいですか

FONT-FAMILY:を使用した時に、一般的なブラウザで表示される書体はなにがあるんでしょうか？
個人的に「HGP創英角ﾎﾟｯﾌﾟ体」が好きなので使いたいのですが、見れなくなるようでは意味が無いので・・・

MAC IE5において
表示がとまってフリーズしてしまう事態に陥りました。
フリーズするようなバグって報告されていますか？

>>261
いろいろ。
JavaScriptで無限ループ書いたくらいでも落ちることもあるし。
OS9は良くも悪くもシングルタスクだから、
アプリが逝くとシステムごとあぼーんしちゃうよ。

あ、input要素をポコスコ生成しても落ちた気がする。

>>262
ジャバスクリプトは使用していません。
インプットも使用していません。
IE5でみてフリーズ、電源切断で再起動です･･･。

ttp://weathernews.com/jp/c/
ここのようにオールCSSで作ったのです。
コーポレートサイトなので
MACで見れないとヤヴァイ･･･。
納期も近い･･･。

>>263
俺が見る限り、CSSの適用の時点でjavascriptを使っているように見えるのは気のせいか？

>納期も近い･･･。

　　土下座だな。　な？

>>264
ウェザーニュースはジャバスクリプト使っていますが
私は使っていません。
IEであろうとフォントサイズはピクセル指定･･･。

>>265
首つろうかな

>>263
問題有りそうなところ（検討つかなければ全体）をとりあえずコメントして
みて、徐々に範囲を狭めていって、問題が発生したところさぐる

という古典的デバッグ法があるので試してみれば。

>>263
ttp://www.macedition.com/cb/ie5macbugs/index.html

英文だけど、一通りまとまってはいる。

>>263
MacのIE5で見たが、普通に見れたぞ。

ttp://www.i-mezzo.net/menu.html
の「日付別過去ログ」みたいにマウスが触れると色が変化する(リンク部分とは別に)
ってのはスタイルシートですか？
ソース見たけどjava scriptぽかったので。

分かりづらかったらすみません。

JSだね
CSSでもまったく同じようにできる
昔はJS使ってるサイトが多かったけど対応してないブラウザ対策だったのかな

java scriptですか。
CSSでのやり方を調べて、対応ブラウザの多い方使います。

ありがとうございました

IEのバグが減ればサイト作りも少し楽になるね。

Internet Explorer 7 beta 1の片鱗が明らかに〜公式ブログで公表
http://internet.watch.impress.co.jp/cda/news/2005/04/25/7418.html

透過pngｷﾀﾜｧ*･゜ﾟ･*:.｡..｡.:*･゜（η‘∀‘)ηﾟ･*:.｡..｡.:*･゜ﾟ･*
けど、「peekaboo」バグと「guillotine」バグってなんぞ？

>>275
各ブラウザの寸法の取り方が統一されるということですよ。
これによりデザイナーはレイアウトがしやすくなる。

おおう、マージン・パディングのアレですかね。
あとは旧バージョンが死滅するのを祈るばかりか。

>>276-277　違ふよ。あれではない。リンク先を讀み給へ。

キモ…

IFRAMEを中央にするにはどうしたらいいですか

>>266
や、やっぱりjavascript使ってるよ、ブラウザごとにCSSを選別するところで。
document.writeが関係あるかわからないけどね。

>>269で普通に見れているんだから問題ないんじゃね？
個人的に気になるのは、サービスというメニューで、
テキストがかぶっているところぐらいだし。

>>280
>>6-9

(´･ω･`)

>>266
>>263で挙げたのは「全部CSSでやった」というところが似ているサイトなんでしょ？
困っている問題のサイトは別物なんでしょ？

これはコントですね？

透過PNGでどんなことができまつか

パンツが透けます。

皮膚が透けます

http://www.geocities.jp/kihikos/
CSSで始めて書いてみたのですが、わからない点があります。

よくBlogなどでよく見かけるように左にメニュー、右にコンテンツ類を掲載する場合のスタイルの定義です。
例で言えばhttp://www.iwaki-ism.com/blog/のような感じにしたいのですが・・・

>>288
<div id="AAA">
右ブロック
</div>
<div id="BBB">
左ブロック
</div>

div#AAA{
width: 適宜;
float: right;
}
div#BBB{
margin-right: 適宜;
}

今頃必死な266ｗ

cssごときで質問することがあるんだ

くまー

>>266
良い案を教えてあげよう。
1面全て画像で作成し、bodyの背景に指定。
他の要素は全部　display:none;　これ最強。
糞クラにはマジでおすすめ。

align="absbottom"を使わずに、cssにて画像をボックスの下端に設置するのって可能ですか？

ヘッダ画像
画像
画像
画像
フッダ画像

左メニューが上記のような感じなのですが、absbottomを使わないと全てに隙間が空いてしまう状態です。

自己解決しました。

img.tekitou{vertical-align:bottom;}

でしたね。すれ汚し失礼しました。

>>270のＣＳＳでのやり方を探しているんですが分かりません。
オンマウスで特定のセルの背景を変えたいんです。
おそらくhoverだと思って色々試してるんですが・・・

何をどう試したのかソースを書かないと、こちらもどう助言していいやらわかりません。

>>270
セルの中にハイパーリンク無し？
ありなら　

div a:hover

とかで出来るでしょう？

http://css.maxdesign.com.au/listamatic/vertical08.htm

>>297
こういうことじゃないの？

>> 289

早速修正してみましたが、少し違和感があるような感じが感じるのは気のせいでしょうか？
どうすれば先のHPのようなデザインになるのでしょうか？

CSSでDIVボックスの背景にイラストを設定しているのですが
imgに対するalt=""や文章に対するtitle=""みたいにオンマウスしたとき
説明コメントを表示させたいのですがどうすればいいですか？

<div title="">

>>302
天才ですね。あなたというお方は…
感謝致します。誠にありがとうございました。

　　　 　　 ヽ(・ω・)/　 　ｽﾞｺｰ
　　　　 　＼(.＼ ノ

http://www.openspc2.org/reibun/javascript/mouse/023/index.html
すいません。要は↑をＣＳＳで出来るのか？って事を聞きたかったんです。
ＪＳでやればいいんですが、どうもＪＳは理解しづらくて。。。

できるよ

<a href=""><span style="background-color:"000">AAA</span></a>

ごめんデタラメ書いてしまった

.table1{background-color:#ffffff}
.table1:hover{BACKGROUD-color:#000000}
↓
<TD class="table1">あああああ</TD>
という状態です。何がいけないんでしょうか？

>>309
標準規格でも出来る事になっているし、
Firefoxでもoperaでもsafariでも出来るんだ。

IEはCSS対応が糞なので出来ないけど。
IE7が出たら出来るようになってるかもね

な、何だってー！？(AA略


あ、ありがとうございます。IEはCSSが糞だったんですか・・・
素直にＪＳ使って頑張ります・・・

>>270
出来ない事も無いけどハイパーリンク無しのセルをCSSでJSのONMOUSEみたいにするにはセルの外側から<a ・・をかけるというかなり無理がある。
リンクが無いセルの中だけの色を変えたいなら素直にJS使う方が良いかも。

onmouseover="this.style.background='#000000'" onmouseout="this.style.background='#666666'"

そんなかんじ

>>270のリンク先のようにリンクを含んだセルならスタイルシートで簡単だべ

>>270
a {display: block; background-color: red;}
a:hover {background-color:blue;}
つー感じでできないか？

CSSのFAQサイトとか誰か作らないのかな〜
サイトを作りたいけどネタがないってのをどっかで見たんだけど、その人に頼んでみたい。

>CSSのFAQサイト
糞も含めてゴマンとあるだろ？

>>318
このサイトのテンプレって意味です。

>>319
>>6-9

フロートで横一列に四つのボックス(div）を並べたんだけど、
WinIEで見ると、表示サイズによって正常になったり、最後のボックスが
２段目に改行されたりする。

widthをかっちり４分割（２５％）ずつとったのが悪いのかな。

悪い

フロート難しいね

>>323
フロートってレイアウト用じゃないからね。
どの方法を使っても一長一短。
用途によって使い分けると。

テーブルならほぼ完璧だけどね。

一言多い。

ﾋﾟｺﾜﾛﾀ

テーブル使うことにしたよ
スキルが上がるか、ブラウザの表示が改善されたら
そんときこそCSSで実現してみようとおもう

テーブル最強だよね

かっこいいサイト見つけてソース見たらtable tr tdの羅列だったときのがっかり感といったら他に例えられないほどだけど

ブロックを重ねる方法を教えてください。
テーブルで。

ブロックをテーブル内に配置し、さらにブロックで囲んでレイアウトする。
テーブルに不可能はない。

軽く表示することが不可能

>>329
あ、いや、内包じゃなくて部分的にです。

ぽじしょん：りれいちぶ；で動かせばいいよ

なんかさぁ、いろんなWebサイトでCSSレイアウト ｖｓ テーブルレイアウト、
Strict vs Transitionalの話を見てきたけどさぁ、
結局、利点なんてほとんどなくて（めちゃくちゃな入れ子しまくりとか、
font乱射とかは論外だけど)、
流行とか、実情を無視した正しいHTML信仰のような気がしてきた・・・。

>>333
広告の裏へ

<div>
<p><img src="" width="200" height="150">あいうえおかきくけこ</p>
<ul>
<li>abc</li>
<li>def</li>
</ul>
</div>

といったDIVブロックで、

div p img{
float:left;
}

として、画像の右側にテキストとリストを持ってきているのですが、
画像の高さより、テキスト量が少ない場合、DIVの高さがテキスト
までになってしまい、

div{
border:1px solid #000000;
}

としたとき、画像がはみ出てしまいます。これを解消するにはどう
すればいいのでしょうか？

テーブルの中に入れる

>>335
ulの後ろ（divが終了する前）で何かしらでclear:leftする。

>>332
結局スタイルシートつかうんじゃん。
だせえ。

>>332
なんとなく りらてぃぶ な気が

テーブルを使うっていうのは、テーブルオンリーってことなのか
ｃｓｓだけに頼らないで、テーブル＋ｃｓｓじゃダメなのかよ

>>339
なに言ってるか全く意味がわからない

表を書くときにはテーブル使うよ

>>339
俺は基本（3カラムとか）レイアウトはテーブル。
その他はstrictで書いている。

テーブルレイアウト＋ｃｓｓ　だな
ケータイの人はごめんね

いつか携帯もCSSに対応する日が来るのかな

>>344
京ポン

>>344
お前が知らないだけで既に対応してるだろ。（もちろん完全じゃないが）

cssの名称に数字をつけたらいけないってことはある？

たとえば
fs12 {・・・}
みたいな

はあああああああああああああああ？

＞ fs12 {・・・}
そんな要素見たことありません。

”#”とか”.”とか頭に付かないのでしょうか？

ちょっとまちがえてるだけじゃん
クラス名とかそんなこと云々じゃないことぐらいわかれ
日本語の流れがわからないばかめ

.fs12 {・・・}

CSSでマンガの吹き出しみたいなのを作りたいのですが、参考になるサイトとかありますか？
↓こんな感じのやつです。TABLEは使いたくありませんが。
ttp://kirby.age.jp/G-Light_F/glight.cgi

＞ クラス名とかそんなこと云々じゃないことぐらいわかれ
クラス名やID名を指していらっしゃるのではないとするとHTMLでは無理です。

XMLのことを話していらっしゃるのでしょうか？

>>351
http://www.mozilla-japan.org/
の角丸の部分。

しつもんです。
ttp://hotwired.goo.ne.jp/webmonkey/98/24/index2.html
これをみると、
position:absolute;絶対指定して
レイアウトするのがなんとなくいいかなぁなんて思えてくるのですが、
テーブルデザインがやたら多い現状を見ると、これを使った
位置固定にも欠点があるのでしょうか？

質問です。
同じ要素内にclassとidは併記できないのですか？

<table class="xxx" id="yyy">〜〜〜</table>
このように書くと、Firefoxではyyyに指定したcssが表示されませんでした。
これは文法違反なのでしょうか。それとも、CSSのブラウザごとのバグなんでしょうか。

kimikimi

バグかどうか知らんが、そういったケースが出現するのかな・・・

classの内容をidの中に含めて書いては不都合が有るのかね？

>>354
IEで、文字選択とかがおかしくなることはあるけど
基本的に欠点はない。

>>358
thx！
FrontPage2003のレイヤー機能で簡単に配置ができるようなので、
特に欠点がないのならこれでデザインをしようとおもいます。

>>358
文字サイズをもりもり大きくしていくと…

>355
できる
何か間違っている可能性大

>357
class="section" id="topics1" とか class と id を併用して
それぞれにスタイル指定なんてよくある話かと

>よくある話かと

それを無駄と言わずして何というのだ。

クラスは全部にIDはそこだけ　なにが無駄だ？

私、15ﾊﾞｲﾄの無駄だと思います。

>>361
回答ありがとうございます。
しかし、何が間違っているのかわかりません。

http://www.geocities.jp/sayashigumi/order/1996bluewave.html
http://www.geocities.jp/sayashigumi/order/order2.css

Firefoxではborderがうまく表示されません。ご教授ください。

うちのクラスにはｴﾛがいます。

idを数字から始めるなよ

>>367
両方classにしてもダメでした。

>>368
だから、数字で始まっているを id="19??????" を id="a19??????" に置き換えたらできるって。

>>369
いや、それもダメやったんよ。

>>370
俺はできたぞ。
cssの#19????を全部#a19????に置き換えるんだぞ。全部。一カ所だけ置き換えても意味ないぞ。

疑似クラスとクラスを組み合わせるには
どうすればよいか分かりません。

具体的には、テーブルごとにリンクの色を分けたいんですが、
外部CSSで
.menu a:link, .menu a:active, .menu a:active{
color:#003300;
text-decoration:none;
text-weight:bold
}
.menu a:hover{
color:#99cc00;
text-decoration:underline
text-weight:bold
}
と打って、htmlで
<p class="menu"><a href〜　〜</a></p>
とやっても全く反応しません。どなたかご教授ください。

全部やらないとダメなんですか？
やってみます。ありがとうございます。

解決しました。どうもありがとうございました。

>362
.section h2 { font-size: 120%; }
#topics1 h2 { color: blue; }
#topics2 h2 { color: red; }

<div id="topics1" class="section"><h2>foo</h2></div>
<div id="topics2" class="section"><h2>bar</h2></div>

こういうことしないんだったら 確かに無駄かもしれんけど

#menu{
float:left;
width:150px;
}
#content{
margin-left:152px;
}
と指定して、2段組を作っているのですが、
#contentの中に表を入れているせいか、
IE（6.0/win）だけで、左マージンを保ったまま、
#menuの高さ分だけ下に下がって表示され、
#menuの右側がだだっ広く空白になってしまいます。

http://cssbug.at.infoseek.co.jp/detail/winie/b164.html
このバグかな？と思っているのですが、
何か対策はないでしょうか。

>>362はもう一度１から勉強するべきだとおもふ

ねんちゃ君がいるのかな？

>>335
ttp://www.lucky-bag.com/archives/2005/03/float_overflow.html

>>362=>>378

ねんちゃ君がいるのかな？

>>376
ＨＴＭＬソースも出してくれないと。
もしそのバグなら親ブロックが関係するんだし。

800*600は無視して良いですか？

>>383
うちのじーちゃんが生きて使ってるうちは無視しないでください。

じゃあTABLEにしようかな・・・

テーブルタグにbgcolorを指定したら
bodyタグで指定してる壁紙が見えない。
テーブルタグのbgcolorを半透明にする方法ありませんか？

>>386
http://www.tohoho-web.com/css/reference.htm#Filter

半透明にしたpngファイルを、tableタグの背景画像として扱う。

UAがαチャンネルに対応してないとダメだけどなー。

1ドットごとに透明・不透明を繰り返した
透過GIFファイルを背景に貼る。など

フィルター使えよｗ

>>382
あ、そうですね。ごめんなさい。
あのバグかというのも私の間違いかもしれません…。
<body>
<div id="header">ヘッダ</div>
<div id="menu">メニューの中身</div>
<div id="content">
　　　<table>大きな表</table>
</content>
<div id="fotter">フッタ</div>
</body>

CSSは>>376に加えて、
#header{
width:100%;
}

#fotter{
clear:both;
width:100%;
}
です。

</content>……？
fotter……つ、釣られないぞ！

<div id="content">
　　　<table>大きな表</table>
</content>
~~~~~~~~~~~~
うん。やりたいこととか、伝えたいことはわかる。

<p style="word-spacing:2em">the word is good</p>
欧文の間隔あけができません。letterならできるのですが
どこか不具合がありますか？

>>394
ブラウザのバージョン書かないと。

WinXP firefox1.0.2+IE6使用です。質問させてください。

html { background: #000 url(○○.jpg) fixed; }
body { background: #fff url(××.jpg) no-repeat fixed right top;
width: 500px; margin: 0 auto; }

としたときIEではhtmlとwidthが反映されないのですがバグでしょうか？
それともなにか記述ミスでしょうか？　すみませんがレスお願いします。

>>396
ttp://cssbug.at.infoseek.co.jp/detail/winie/b142.html
body要素にwidthが指定できないのも根源はこのバグと同じ

>397
ありがとうございます、ソース書き直します(´･ω･`)

どなたかご教授ください。>>372

>>372
text-weightというプロパティが謎だし
セミコロンが抜けてる箇所があったりするが
.menu a:visited がないからという落ちじゃないよな？

>>400
ありがとうございます

セミコロンがないのとか、font-weightだろ
とかはここに書き写す時に間違えただけです。

visitedは今確かめましたが、やはりactiveが2回になってました。
書き直したらうまくいきました。
すごい初歩的ミスでしたが、即ﾚｽ感謝します。

というかコピペ知らんのか？

.demo { border: 1px #0000ff solid; }
.demo2 {border: 1px #0000ff solid; border-collapse: separate;}
<table width="140" class="demo2">
<tr><td class="demo">あ</td></tr>
<tr><td class="demo">い</td></tr>
<tr><td class="demo">う</td></tr>
</table>


<table width="140" border="1" cellpadding="0" cellspacing="1" bordercolor="#0000ff">
<tr><td>か</td></tr>
<tr><td>き</td></tr>
<tr><td>く</td></tr>
</table>

上と下では枠の太さがどうしても違ってきてしまうのですが(上の方が太くなる)、
上のを下の太さにあわせるにはどうすれば良かとですか？

>>392
>>393
あ･･･orz。
眠いときに書き込みすべきじゃないな…。

</content>じゃなくて</div>です。
fotterじゃなくてfooterです。

>>403
GeckoやOperaなら、border-spacing: 1px;を入れれば同じになると思うけど、
IEは対応してなかったはず・・・

http://z.la/x45zbこういうｻｲﾄはDOCOMOからも正常に表示されるのか？

>>405
border-spacing:の後に１pxですか
ありがとうございます

しかし、IEが対応してないのは厳しいなぁ…
IEをたてればFireFoxがたたず
FireFoxのこと考えてｽﾀｲﾙｼｰﾄを書き始めたらIEがたたず

うざさ爆裂…

input.submit{}というformのsubmitボタンのみのスタイル適応は出来ないのでしょうか？
firefoxで試しているのですが反映されません

<input class="submit">ってことだよな？

内枠にも色つけるために
<td class="demo">なんてやっていますが、
まとめてﾄﾞｶﾝって出来ないものですかね？
table,td,tr { border: 1px #0000ff solid; }
なんてやってしまうと、他のやつにまで影響が出てしまいますし

個別にやるしかないのでしょうか？

>>410
内枠ってどこさ？ 他のやつっていうのは？
>>403でいうtable.demo2の中のセルにのみボーダーつけたいんだったら
table.demo2 td, table.demo2 th { ... } だが。

>410
もうちっとべん(ry

>>411
多謝！！
出口が見えてきたかもしれません

>>412
もじら組がもっとしっかりしてくれれば…
しかし、いい勉強になっておりまする

テーブルで重ねてごまかすよりも、
ｽﾀｲﾙｼｰﾄ勉強した方が軽くなりますし


いろいろ教えて下さってありがとうございます

>>409
<input type='submit' value='ぼたん'>

この状態のsubmitボタンにスタイルをclassなど定義せずに適応したいのです。

input[type="submit"] {
...
}

それもIEは対応してないんだよね・・・
IE7で初めてCSSに（まともに）対応するらしいけど

>>415
ありがとうございますm(_)m
検索していて[type="submit"] というのを見てたのに、そういう定義の仕方は
無いものと勝手に思い込んでいました・・・

フレームは使用するべきでは無いとききましたが、
フレームとはなんでしょうか？CSSのフレームのことだと思うのですが、
なぜ使用はさけならないのでしょうか？

CSSにフレームなどないっ

>>411
と思ったら、教えていただいたのをかますと
テーブル内テーブルも全部同じ色になっちゃいますよね

ってことは結局、
<td>にも１つ１つ関連付けしていかなくてはならないってことなんですね…

>>420
大丈夫か？

>>420
なぜもじら組が出てくるのかさっぱりわからないんだけど
もうちょっと文脈セレクタについて勉強したほうがいいよ。
table要素の中のtable要素は table table { ... } ね。

tableの子要素ではtext-alignは指定できないのでしょうか？

なぜそう思う？
もし何かやろうと思ったけど駄目だったのなら
どうやってどううまくいかなかったのか書け。

>424
即レスありがとうございます。
すみません、質問自体が間違っていました。

<table>
<colgroup class="a"></colgroup>
<colgroup class="b"></colgroup>
<tr>
<td>ccc</td><td>ddddddd</td>
</tr>
<tr>
<td>eee</td><td>ddddddd</td>
</tr>
</table>

colgroup.a {width: 5em;}
colgroup.b {width: 30em;}

このときのcolgroup.aを text-align:center; にしたいのですが・・・

>>425
　嫁
http://www.ne.jp/asahi/minazuki/bakera/html/reference/table#colgroup

>426
レスありがとうございます。
何度か読ませていただいたんですが結局意味がわからず・・・
widthにて代用しました。
理想の形とは違いますが妥協します。
せっかくレスつけてくださったのにすみません。ありがとうございました。

iモード専用サイトを作っていますが参考にしたいサイト
⇒girlswalker.comというのがありましてこのサイトと同じような構成で
作りたいのですが普通のHTMLではできないような背景
（途中から背景色が切り替わる）になっているので
このサイトはCSSを使っているんでしょうか？分かる方教えてください！
ちなみにXHTMLに対応していないドコモ以外の携帯から上記サイトを見ても
普通に表示されてしまうので最近の携帯から見れるかたお願いします。

ttp://www.timedesign.ws/

このソースがっかりしていいですか？

>>429
始めは普通だったけどだんだんフェードインするかのように…。
最後は吹いた。

質問させてください。

<div class="left">
　サイドメニュー
</div>
<div class="main">
　メイン
</div>
<div class="right">
　その他
</div>

とした時

div.left{
float:left;
width:200px;
height:100%;
background:#000000;
color:#ffffff;}
div.right{
float:right;
width:200px;
height:100%;
background:#000000;
color:#ffffff;}

としています。
しかしメイン部分が長くなった場合サイドメニューとその他部分の背景色が短くなってしまいます。
どうしたらよいのでしょうか。
メイン部分に合わせて毎回heightを指定するほかないのでしょうか。

ttp://55.139.148.210.dy.bbexcite.jp/
うはっｗｗｗｗｗｗおｋうぇおｋｗｗｗｗｗｗｗｗｗｗｗｗ
ｗうはっっっうはっｗｗｗｗｗｗうはっｗｗｗうぇ
ｗｗｗｗｗｗｗｗうはっｗｗｗｗｗｗｗｗｗｗｗｗ
ｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗおｋｗうはっうぇうはっ
ｗｗｗｗｗｗ

↑
山田感染者か？

>>431
これじゃいやかい？
<html>
<head>
<style>
*{margin:0;padding:0;}
body{background:#000000;}
.left{position:absolute;width:200px;top:0;left:0;color:#ffffff;}
.right{position:absolute;width:200px;top:0;right:0;color:#ffffff;}
.main{margin:0 200;background:#ffffff;height:100%;}
</style>
</head>
<body>
<div class="left">
　サイドメニュー
</div>
<div class="main">
　メイン
</div>
<div class="right">
　その他
</div>
</body>
</html>

>>434
ありがとうございます
float使わなきゃいけないような妄念に駆られてました

.main{
font-size: 13px;
width: 95%;
margin: 0em 0em 5em 0em;
}

<div class="main">
ああああああああああああああああああああ・・・（続く）くBR>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa・・・（続）くBR>
</div>

こんな感じにしてたら、横幅が95％を超えたとき
全角の方は改行されるが
半角の方は改行されずに横に続くのですが
これが普通なのでしょうか？
IE6使ってます。

>>436
普通です

<p class="box">段落<br>
testtesttesttesttesttesttest<BR>
testtesttesttesttesttesttest<BR>
testtesttesttesttesttesttest</p>

p.dan{
background-color: #EAEAEC;
filter: alpha(style=0, opacity=30);
margin: 1em 2em 1em 2em;
padding: 0.4em;
border-style: solid;
border-width: 1px;
border-color: #EDEDEF #BABABC #BABABC #EDEDEF;
}

こんな感じにして、背景色を半透明にしようとしたのですが
半透明になってくれません。
どこか間違ってますか？

>>437
半角の字も強制改行したいのですが
無理なのでしょうか？

>>439
これじゃいやかい？
word-break:break-all;
（IE独自拡張）
overflow:hiddenも入れればmoz系の場合はみ出し部が表示されない。

>>436・>>439
何度も何度も既出の質問だ。過去ログ見たら？
ラテン・アルファベットで記す言語は、語ごとに分かち書きして
語の途中では改行しないのが大原則なんだよ。
どうしても改行させたければ、IEのみ先行実装したword-break:break-all;でもやれ。
無論、他のブラウザでは効かない。

CSSにおける国際的レイアウト
　http://www.doraneko.org/misc/i18n-format/WD990127.html
Internatinal Layout in CSS
　http://east.portland.ne.jp/~sigekazu/css/international.htm

>>440-441様
ﾟ･:,｡☆Uo･ｪ･oU/~♪了└|力"├♪~＼Uo･ｪ･oU ☆,｡･:･ﾟ

過去ログ見てから質問しろよな。

>>442
それじゃいやだ。
なめとんのかっ！むかついたんでもうこたえるのやめる。
おやすみ。

おいらを忘れないでね・・・

>>441
それはいくらなんでも古すぎだろ。せめてこっちを。
ttp://www.d-toybox.com/spec/CSS3/i18n-format/index.html

>438
p.dan → p.box

>>446
ありがと。でも部分訳だね。
肝腎のword-breakのところが英文のままだから今の場合は役に立たない。

>>447
それ直しましたが背景色が半透明になりません・・・

body {
font-size:85%;
}

ってやると、NNとかMozillaではtableのセル内も85%が適応されるんですが、
IEでは適応されません。
かといって、tdにfont-size:85%;を入れるとNNとかでは
セル内が更に小さいフォントになります。
これ、どうやって回避したらいいでしょうか？
絶対指定はやりたくないので。

p.box{
background-color: #EAEAEC;/*背景色*/
width: 600px;
filter: alpha(style=0, opacity=30);
margin: 1em 2em 1em 2em;
padding: 0.4em;
border-style: solid;
border-width: 1px;
border-color: #EDEDEF #BABABC #BABABC #EDEDEF;
}

横幅指定したら半透明になりました。
でも、文字まで半透明・・・orz

>>450
td {
font-size:100%;
font-size: 85%;
}

>>452
試してみましたが、NN7.1、Firefox共にセル内はセル外より小さくなってしまいました。

>>429が分かりません・・

>>429
すれ違い
http://pc8.2ch.net/test/read.cgi/hp/1065719058/l50

>>452
ﾜﾛﾀ

>>450
td { _font-size: 85%; }

とか。 他にもハックの方法はあるから試してみて。

<div class="cel1">text1</div>
<div class="cel2">
<p>text2</p>
</div>
.cel1 { background: #cc0000; }
.cel2 { background: #cccc00; }
(<p>は<h1>等上下にマージンを含むブロック要素の場合・・)

とすると、Firefox、Operaでは<p>のマージンが<divclass="cel2">の上についてしまうのですが
（<div class="cel1">と<div class="cel2">の間に一行空く感じ）
これを回避するには、<p>text2</p>のtopのマージンを0にするしかないでしょうか？
良い解決法があれば教えてください。

>>449
widthを設定してみたら

>>456
おぉ、ばっちりでした！
さんくすです。

まったくこれだけ解釈が違うなんて困ったもんですね。

>452

table {font-size: 1em;}
こんなやり方もあるぞ

>>450
まづバグ辞典を見ませう。
　フォントサイズの指定が表要素に継承されない(5.x)
　http://cssbug.at.infoseek.co.jp/detail/winie/b023.html

>ページ全体に共通するスタイルの指定はbody, th, tdの3要素に一括して行うこと
>で、この不具合を回避することができます。

body, th, td {
font-size: ...
}

>457
ちょっと違うかもしれないが

p{display: inline;}

とか

>>457
もしかして、まだIE5.0とか使ってるのか？
　親要素を持つp要素のマージンが無視される(IE5)
　http://cssbug.at.infoseek.co.jp/detail/winie/b083.html

>>457
borderをつけるとなぜかdiv.cel2の子要素の上下マージンが有効になるね。
.cel2 { background: #cccc00; border:1px solid #f00;}
NS7.1とIE6.0とで確認。
これは仕様書からはどう説明されるんだろ。

これか。

8.3.1 マージンの相殺（Collapsing margins）
http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/box.html#collapsing-margins
相互に隣り合っているか入れ子関係にある複数のボックス間において、間にパディングもしくはボーダー領域を挟まずに隣接するマージン同士が、結合して1つのマージンになる

>>458
>451で既に試しています。

>>465
これって仕様なんだろうか。
だとしたら、余計なお世話だよ・・・orz

>>460
こっちのほうがスマートでいい感じですね。
挙動は_font-size: ;と同じでした。

>>461
それをやっちゃうとIEとNNで表示が変わってしまうんですよ。

あの、「これじゃいやかい？」って
言葉に興奮するんです。

>>468
>それをやっちゃうとIEとNNで表示が変わってしまうんですよ。
うそつけ。同じだよ。

<table border="2"><tr><td>AAA</td><td>BBB</td></tr></table>
<p>BBB</p>
body, th, td {font-size:85%;}
NN7.1、IE6.0、
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
で、確認済み。

>>468
そもそも>>461のＩＥバグは互換モードだけ、標準モードはバグらない。
それ、わかってますか？

>>470
あ、すいません、こっちはxhtml1.0のtransitionalです。
これでxml宣言ありなんで、IEは互換モードですよね。
以下のソースで表示がNNとIEで変わりました。
（CDDATAとか細かいのは省略で。）
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">body, th, td {font-size:85%;} </style>
</head>
<body>
<table border="2"><tr><td>AAA</td><td>BBB</td></tr></table>
<p>BBB</p>
</body>
</html>

>>472
あ、<html>がおかしくなってるけど、そこは削除でお願いします。

ついでにcharasetもおかしいですね。
こっちでおねがいします。
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<style type="text/css">body, th, td {font-size:85%;} </style>
<title></title>
</head>
<body>
<table border="2"><tr><td>AAA</td><td>BBB</td></tr></table>
<p>BBB</p>
</body>
</html>

結局、html4.01で互換モードだったらバグは回避できますが、
xhtml1.0、xhtml1.1だと互換モードでも駄目みたいです。

解りきったことを・・・

>>474
body { font-size: 85%; }
table, caption, thead, tfoot, tbody, tr, th, td { font-size: 100%; }

>>474
*{font-size:small}

個人的には、本文のテキストの大きさを変えるのはやめて欲しい……

a {
color: #0000ff;
text-decoration: none;
}
a:visited {
color: #ff00cc;
}
a:hover, div#main a:active {
color: #ff0000;
}

と

a:link {
color: #0000ff;
text-decoration: none;
}
a:visited {
color: #ff00cc;
text-decoration: none;
}
a:hover, div#main a:active {
color: #ff0000;
text-decoration: underline;
}

は同じですか？
ブラウザによってNGとかありますか？

>>480訂正

a {
color: #0000ff;
text-decoration: none;
}
a:visited {
color: #ff00cc;
}
a:hover, div#main a:active {
color: #ff0000;
}

と

a:link {
color: #0000ff;
text-decoration: none;
}
a:visited {
color: #ff00cc;
text-decoration: none;
}
a:hover, div#main a:active {
color: #ff0000;
text-decoration: none;
}

概ね同じだけれど
こういうのだとちょっと違う

<a name="top">top</a>

過去ログや検索サイトを読み漁ること半日です。
初歩的な質問過ぎて、スレ違いかとも思いますが、
お手空きな方が居ればと思い書き込みさせていただきます。

今回初めてCSSを使用したサイト作りに挑戦していて、
転送の時点で行き詰ってしまいました。
試行錯誤して様々に転送してみたのですが、表示されません。
サーバーはぷららなのですが、ここはHTMLとCGIのサーバーが
別々で、CSSファイルをどちらに置くのかが解りません。
両方試してみても駄目で困っています。
どうかよろしくご指南くださいませ；
CSS自体はフリーで配布されているもので、問題ないと思うのですが・・。

話がよく飲み込めないが、cssはHTML側に置けばいいんじゃないかな
それから、HTML文書の中に、CSSへのリンクは記述した？

“CSS自体はフリーで配布”というのが気になるけど、
話を最初から順に箇条書きにして書くか、URLを晒すとか

どこかでCSSの外部ファイル名の例を挙げるスレッドがあった気がしたのですが、
どこでしたっけ？
またはお勧めのファイル名はありますか？

>>485
好きな名前でよろしい
default style-1　とかそんなのでいいよ

484様、天のお助けが来た気分です；；有難うございます；；

CSSは今、改めてHTML側へ転送しましたが、表示されませんでした。

使用しているCSSは、初心者向けとして配布されているもので、
書き換えはページタイトルや、コンテンツ名の書き換えのみの
ものです。
配布サイトのFAQにも、書き換えは簡単なので、説明は省きます、と
記載されているほどのものです。
また反映されない場合についても、
アップロードし忘れてませんか？CSSのアドレスがローカルアドレスになっていませんか？
との記載のみです･･･。
ローカルアドレスについても検索かけて色々調べましたが、いまいち
理解に及ばず･･･これが原因なのかとも思いますが、
書き換えの必要な色分けされた箇所に、絶対パス指定とか
ないもので、いじっていいやら、困っています。

完全に放置の模様・・・（´・ω・`）ｼｮﾎﾞｰﾝ

>>487
・htmlファイルの中、<head> 〜 </head>間に
　<link rel="stylesheet" type="text/css" href="CSSのファイル名.css">
　を挿入

・ｈｔｍｌとｃCSSを同じ場所にアップロード

ってのはやった？

>>487が素人過ぎてかわいい件について

>>490
あ、そういうことか。
なんてまとまりのない話をするやつだ、としか思わなかった

>>488
すまないね。でも俺、半透明とか意味分からないんだ
え、それってｃｓｓなのか？ってレベル…

>>489
style.cssと保存して
<link rel="stylesheet" type="text/css" href="CSSのファイル名.css">
を挿入しましたができません。
CSSのファイル名.cssってところも変えるのでしょうか？

492さんはどなたでしょうか、、。

>489様、
・htmlファイルの中、<head> 〜 </head>間に
　<link rel="stylesheet" type="text/css" href="CSSのファイル名.css">
　を挿入

をしてみましたが、駄目でした；；
参考までに、一応、いじらなくてもいいとされている部分を。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link rel="stylesheet" href="css.css" type="text/css">
<title>お好きなタイトル</title>
</head>

と記載されています。
同じ場所にアップは出来ています。
重ねがさねすみません；；

こ、これは壮大な釣りか……？

>>492
style.cssって名前にしたんだな？　じゃ、CSSのファイル名.cssってところをその名前に変えてね

はっ･･･。

<link rel="stylesheet" href="css.css" type="text/css">
と
<link rel="stylesheet" type="text/css" href="CSSのファイル名.css">
は微妙に違えど同じ物なんですかね。。
試してきます；；
無駄なレス消費ごめんなさい。

>>492
こんなにドキドキしたのは生まれて初めてだ。ちょっとした娯楽をありがとう。

>>488
451で解決してるじゃん
指定した要素内全てが半透明になるのは仕様です

箇条書きのliタグにpaddingを最小(0)に設定しても、
"・"と文字との間が結構空いてしまうのですが、それ以外に間隔を狭める方法はありますか？

もしliタグを使わないならどのタグがお勧めですか？

下のような方法で自己解決しました。
position:relative;left:-4px;

liタグのlist-style-imageで画像指定したときに、
リストの行が長くて折り返してしまう場合に、画像が中央にきてしまうのですが、
画像が複数行にわたっても上の最初の位置にする方法はないのでしょうか？

おいおい、画像が複数行にわたるのか？ >>500

>>499
それは心なしか良くなさげ。
「・」の位置やサイズは各UAが...

>>498
私も同じように思ったことがありますが、私の場合は
ul{
　　padding-left : 0;
}
li{
　　list-style : none;
　　margin-left : 0;
}
li:before{
　　content:" - ";
}
こんな感じで無理やり解決しました。
IEだと " - "を表示してくれないけど、そこは我慢。
ちなみに、contentの文字列にマルチバイト文字(日本語とか)を使うと
Safariとかで正しく表示されないので注意です。

過去ログへのショートカットをつくりますた
http://perape.sakura.ne.jp/archive/hpb/css.htm

おつかれ。
しかしここの住人にとっては
ケンカ売ってるようにしかみえないのではまいか

超ど真ん中なテーブルレイアウトにﾜﾛﾀ
私だったら定義リストで表現するかな。

<h1>Web制作板「CSS」関連スレッド過去ログ倉庫</h1>
<h2>現行スレッド</h2>
<dl>
　　<dt>スレタイ</dt>
　　<dd><a href="〜">URL</a></dd>
</dl>

<h2>過去ログ</h2>
<dl>
　　<dt>スレタイ</dt>
　　<dd><a href="〜">URL</a></dd>
　　<dt>スレタイ</dt>
　　　：
　　　：
</dl>

多分ネタだろ・・・。

別にこのサイトはこのスレだけに絞っているサイトな訳でもにないんだし、
他と同じようにやっているだけだろ。

http://keizai.xrea.jp/markup/css0a.html

レイアウトに何を使えばいいのかわからなくなってきたorz
ひょっとして、真の意味での見る側にやさしいデザインって、テーブル
じゃないとできないってオチ？

スタイルシートを切っても、流れと意味を残せれば、それが優しいデザイン（に近い）

>>509
レイアウトは兎も角背景画像が見る側に優しくない。

＞スタイルシートを切っても
って表現が気になるんだよなぁ。
「切れた」わけじゃなくて、UAのデフォルトに切り替わっただけなんで。
そもそもHTMLをどう表現するかが「スタイルシート」だからね。

>>512
切っても、ってのは確認するっていう意味だ
スタイルシートの通用しない携帯端末なんかで閲覧しても、って言い換えてもいい。

とはいえ、あくまでも俺が勝手に思っている指針だからね
当てはまらないこともあるし、そもそもスタイルシート非対応をターゲット層に入れていないなら
はじめから関係ないし。

あんまり気にしないで、ってことで頼みますわ

http://cssbug.at.infoseek.co.jp/detail/winie/b075.html

このバグの対策はありますか？

ｵﾏｲ　アホちゃうか？

すみません。言葉が足りなかったようで・・・。

たとえばテーブルを使うとか、何か方法はないかと思ったのですが
あまり無意味にテーブルを使いたくないので他にいい案はないかと・・・。

body {
background-color: #cccc00;
}
と指定してあります。

そんでh1をbodyと同じ背景色にしたいのですが、
h1 {
background: url("unko.gif") repeat-x 0% 100%;
}
と
h1 {
background: #cccc00 url("unko.gif") repeat-x 0% 100%;
}
では同じ結果なんですが、どちらが正しいですか？

>>517
ただしいというか、前者はｈ１の背景が透明になっているという感じ。
それだけ

>>505
削除しました。スマソ

もったいない

HTML批判でサイト潰し
まだ懲りないようで

ボックスの中にある画像を真ん中の高さにする方法を教えてください。
<td valign="middle">みたいなのをやりたいんですが、
vertical-alignはちょっと違う感じがしたので。

line-height

ちょっと教えて欲しいのですが。
小さなサイズの画像ファイルを拡大して背景画像にする事は可能でしょうか？

background-imageに関する記述を調べても
同じサイズのままの配置のアレンジはあっても
サイズを拡大して表示する方法が見つからないのです。

レンタルのブログを利用しており、アップできる画像のサイズに制限があり
望むサイズの画像がアップできないため
何とか制限一杯のサイズの画像を引き伸ばして表示させたいのです。

よろしくお願いいたします。

>>524
汚くなるだけだと思うが…

多分、>524には意味が解らない。

背景のサイズ指定がないのはソフトで背景ファイルそのものサイズを自由に変更できるから
>>524　わかる？　ファイルサイズを大きくせずに表示のピクセル大きくすればいい　汚くなるけど。

画像にも依るけれど
(もしできたとして)拡大するよりは
減色した方が見るに堪えるような気もする

>>525-528
返事ありがとうございます。
多少汚くなっても構いません。
(実際にやってそういう問題がでるならやめます)
それはbackground-imageの指定で出来るものですか？

テンプレにあるサイトをいくつか見ましたが、そういうのないんですよ・・・
http://www.ne.jp/asahi/minazuki/bakera/html/css/colors
http://www.zspc.com/stylesheets/css/ref/desc4.html#itembgimage
http://hp.vector.co.jp/authors/VA022006/css/colors.html#background-properties

>>524
お気づきの通り、そんなプロパティは無いのです。
というか、PNGとかで圧縮してもうｐできないほど厳しい制限があるのか？ｗ

＞お気づきの通り、そんなプロパティは無いのです
そうですか・・・わかりました。

＞PNGとかで圧縮してもうｐできないほど厳しい制限があるのか？
というか、背景一杯の大きな画像をうｐしても1/4ぐらいの大きさにされてしまうのです。

まあ、背景色と組み合わせて現状でなんとかカバーする事にしました。
ありがとうございました。

>>524
どこのブログだよ、それ。

>>532
>というか、背景一杯の大きな画像をうｐしても1/4ぐらいの大きさにされてしまうのです。

ﾊｧ?エラーとかじゃなくて、アップは出来るんかい！？
それって、お前がアップしている画像の解像度が300dpiとかなんじゃネェの？

質問です。

外部cssの使い回しで、外部cssでdivの文字サイズを指定してあります。
あるhtmlファイルでは、<link rel="stylesheet" ..... > でリンクした後に、
そのhtml内のdivは、文字サイズを指定せずに、ブラウザに任せるデフォルトに戻したいのですが
どのように記述したらよいでしょうか。

<style type=text/css>
div { font-size: normal; }
</style>

これでは文字サイズが固定されたままでした。

簡単なのは、文字を固定したいdivとしたくないdivをクラスをつけるとかね
pxとかptで固定したのか？　それとも％やsmallとかx-large？

>>536
ptで固定してあります。
最初からクラス分けしないと、一旦固定してしまったサイズを固定なしに戻すのは不可能でしょうか？

>>537
そのhtml内のdivだけにクラスつけるとかして、
div．変えたいdivのくらす　｛　font-size：　medium；｝でいけると思う

>>538
いけました！助かりました。ありがとうございました！

あー、そいつぁよかった

すみません、もう一つ関連した質問です。
そのdivは、paddingもpxで固定してありました。
paddingも固定なしに戻すことはできますか？

>>541
あらためて、変えたいdivにpadding:を指定すればよろし

書き忘れ。
divはデフォルトで、マージン、ぱぢんぐは０だったと思うから

>541
頼むから少しは頭使ってくれ。　な？

お聞きします。

<span style="width:3em; border-width:1px; border-style:solid;">giko mona 2ch</span>
<span style="width:3em; border-width:1px; border-style:solid;">giko mona 2ch</span>
<span style="width:3em; border-width:1px; border-style:solid;">giko mona 2ch</span>

と書くとIE6.0（テーブルセルのように内側で改行しつつブロック表示）と
Firefox1.03（改行せず全部横並び）で表示が異なりますが、
どっちのブラウザのほうがCSS的に正しい解釈なのでしょうか。
できればIE的解釈の表示をFirefoxでもできるようにしたいのですが。

>>543
em再指定で上手くいきました。ありがとうございました！

Firefox

ブラウザ作れ

>>545
インラインとブロックの勉強すべし。

>>545
span span span とくると、ｽﾊﾟﾝｷﾝｸﾞをイメージしてゾクッと来るのだが・・・

スタイルシートを使ったページに、表を表示させようかと思ってるのだが
普通にテーブルタグで、表を表示させると全然合わない。
スタイルシートを使ったテーブルデザインが
置いてるサイトあれば教えて(　ﾟДﾟ)ﾎｽｨ

>>549
そういうAAがあったような・・・

目次も表のうちだよな。table of contentsって言葉もあるし。
ttp://www.ne.jp/asahi/anarchy/saluton/bnlist.htm

>550 >全然合わない。
これじゃ解らん。きちんと説明しろ。

Googleの検索結果画面にある"Gooooooooogle"みたいなリンク、
ああいうのは、厳密にはリストにすべきだと思うんだが、
そういうの全部、最適と思われる要素でHTMLを書いていくと、
ものすごーくタグのネストが深くなったり、CSS切る(あるいはCSS非対応ブラ)と
ゲッソリしたりするじゃん?
できるだけStrictに書きたい気持ちはヤマヤマだが…ってな悩み、
藻前らはどの辺で妥協しますか?

…とか、ここに書くのはスレ違い?

MSゴシックで表示させたら、見た目が詰まってるように感じたので、
letter-spacing で指定して字間を空けてみました。

そうすると、空行(brタグのみ)が詰められて表示されてしまったのですが、
これは回避できるのでしょうか？

試していたブラウザはIE6です。

※１のテーブルをcssになおしたくて※２に変えたのですが、
同じように表示されません。これは何故でしょうか？どこか間違えていますか。

※１
<table border="1" cellspacing="1" cellpadding="10">
<tr><td>あああああ</td></tr>
<tr><td>いいい<br>ううう<br>えええ<br>おおお</td></tr>
</table>

※２
<style type="text/css"><!--
.css{border-spacing:1px;padding:10px;border:1px;}
--></style>

<table class="css">
<tr><td>あああああ</td></tr>
<tr><td>いいい<br>ううう<br>えええ<br>おおお</td></tr>
</table>

<table border="1" cellspacing="1" cellpadding="10"> でやりたくない理由を述べよ。

Webサイト制作初心者質問スレ Part 132にて、
IEとネットスケープで見るとテーブルの縦の長さが違うことについて
質問しました。そうしたらcssで書いたら長さが同じになるかもということで。
cssにしたいと思いました。

>>55
ＣＳＳ使ってるのにbr連打ですかあ？　恥を知れ。marginで工夫しようね。

>>556
なぜ>>5を見ずに質問する？
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/tables.html#border-spacing

>>555

/* Win IE バグ対策 */
br {
letter-spacing: 0px;
}

letter-spacingを指定した要素内で連続したbr要素が無視される(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b022.html

>>556
表全体をつかさどるtable要素にパディングは意味なし。
パディングは各セルについてるんだろ。

.css td { padding: 10px; border: 1px; }

>>556
.css {
border: 1px outset;
border-collapse: separate;
border-spacing: 1px;
line-height: 1em;
}
.css td {
border: 1px inset;
padding: 10px;
}

ttp://homepage2.nifty.com/m-sato/

・・・。

<style>
<!--

@import url(./css/style.css);

-->
</style>

>>553
お前国語0点だろ？
デザインが合わないって意味だと思う。
普通に理解できる。

<div>で、classとidを同時に併用できるんでしょうか？（実際のブラウザでできるのか？
というよりは、CSSの設計に照らし合わせて、どう書くべきかみたいなところが疑問）
つまり <div class="mybox" id="box1"> みたいな。

.mybox{
　　background: #CCC;
　　border: none;
}
としたmyboxクラスを作る。HTML中には<div class="mybox">という部分が
何回も出てくるわけです。

そしてそのうちの、特定の<div>だけ、.myboxクラスなんだけれども、例えば
borderを表示させたい。そういうときに
div#box{
　　border: 1px;
}
みたく用意しておいて、その<div>だけ、<div class="mybox" id="box1">
とすることは、できるんでしょうか？

また、良し　とされることなんでしょうか？

よろしくお願いします。

>>567
できる。

>>567
はいできます。そしてそれは正しい記述です。

適用するスタイルが複数あって同じプロパティが重複する場合、
id で選択されたスタイルは class で選択されたスタイルよりも
優先されます。

idってnameの代わりですか？

>>568-569
ありが�dございました！

>>570
違います。HTML の場合、id 属性はほとんどの要素で指定することが
できますが、name 属性が指定できる要素は限られています。

HTML 4.01 や XHTML 1.0 では id 属性と name 属性に同じ値を指定
しなければならない要素がありますが、これは互換性のための措置で、
CSS からは両者を別の属性とみなします。

# セレクタは DTD で ID 型が指定されている属性 (HTML では id 属性)
の値を選択しますが、name 属性は ID 型ではないので選択することは
できません。

>>572
サンクス。
そうすると、ｉｄの存在意味が分かんないね。
全部、classでいいじゃんって思うんだけど。

idはリンクで飛べる。

まあ、マークアップする上で使い分ければイイだけだしね。
nameよりも便利なのは確かだ。

DOMでいろいろしたい時とかにもidは使う。

idはスタイルシートのためだけのもんじゃないからね
文書中で一意な識別子として使いましょう

>>574
>>575
なるへそ。
スタイルシート以外での使い道があるんだな。
そのためか。納得。

フォームの値を枠内でセンタリングしたいって言われたんですが

input,textarea{
text-align:center;
}

<input type="text" value="12345" size="10">←「12345」をセンタリングしたい

だと、MacIEでセンタリングされませんでした。。
根本的にtext-alignで実現するのが間違いなんでしょうか。。

何かよい方法をご指南くださいませ。。

魔神

>>559 を見てふと思ったのですが、
節・章を表すようなタグってありましたか？

brタグを使わない場合、
空行はどうやって表現するのでしょうか？

Hxタグでは駄目か？＞節・章を表す

別に<br />使っちゃいけないということではないよ。
ただ、マークアップ言語として適切な使い方をしなさいということ。
隙間を空けたいならマージン、段落として区切りたいなら</p>とかさ。
「段落の区切りではないけど、読みやすさを考慮して1行空けたい」
なんて場合は<br />でいいと思うけどな。
連打はどうかと思うが。

>>577
フォームコントロールに対するスタイルの指定は
必ずしも対応させる必要がないからね。
MacIEでは対応していないんじゃないかな。

↓にスクリーンショットを含むページへのリンクがあるけど
なぜか今行こうとしてもつなげないよ。(昨日は見れたのに)
ttp://hail2u.net/blog/webdesign/about_form_controls.html

>>579
えーと、ちょっとお聞きしたいのですが、
その「空行」は、どのような意味を持っているんですか？

質問です。
現在イラストのサイトを作っています。
メニューページに各作品へのリンクをリスト表示しているのですが、
ページの下部にバナーを貼りたいです。
そこで、

<ul><li>〜</li></ul>
<div style="position:relative;bottom:8px;width:85%;margin:20px auto;">
<p>
<img src="banner.gif">
</p></div>

このようにしてみたのですが、
これだとウィンドウが小さかったり今後リストが増えたりした場合に
リストとかぶってしまい作品へのリンクが使えません。

「スクロールバーが出ていなければ表示領域の下部に表示」
「スクロールバーが出ていたらリストとかぶらない位置に移動」
なんてのは無理でしょうか。
ULタグに下マージンを設定しても駄目でした。
positionの使い方がまだよく分かってないのでアホなこと言ってたらすみません。

>>583
例えば、
ul{
　　min-height : 90%;
}
とすると、ul以降の要素が強制的に下部10パーセント以降に追いやられるので
同じ意図の結果になると思う。
ただし、IEはmin-height対応してないかも。

あるいは、
img{
　　float : right;
}
とやれば、横幅に十分な余裕がある限り、かぶることはないだろうと思います。
バナーを絶対に左側に表示させたいっていうデザイン上の意図があれば
また別ですが。

将来のcssでターゲットできますかね。

文中で
<div id="kono_basyo"></div>


文末に
<div id="adv">長たらしい広告タグ</div>

これを上のkono_basyoに表示させるわけです。

表示位置に書きゃいいわけですけど、
本文に余計なモノを挟みたくないし、
CSSが効いていない状態では見苦しいったらありゃしない。
下に書いてposition:absoluteも試したけど、
フォントサイズ変えると場所がずれるから使い物にならない。

>585
ちっとは勉強しろや!
使い物にならないのはおまいの頭だ。

なにをどう勉強したらいいのかくらい教えれ。
ののしるだけなら、おまいの頭のたかが知れている。

頭「も」たかが知れてる、な。

>584
ありがとうございます。
min-heightとは思いつきもしませんでした。
フロート使う方は、リストの幅が220pxしかないので難しいかも(´･ω･｀)

ところで、（後出しになってしまってすみません）
作品へのリストは入れ子にして、上の階層のリストをクリックすることで
下の階層を表示するということをしたいのですが
（これはJavaScriptでできました）
そうすると、下のリストを表示するたびにページの高さが
どんどん変わっていってしまいますよね。
この場合、やはりページ下部のバナーにかぶってしまうんです。
こういう構成はあきらめたほうがいいでしょうか。

>なにをどう勉強したらいいのかくらい教えれ。

　　ゆとり教育のなれの果てだな。

結局は軽口たたくだけかい。
能無しなら能無しらしく黙ってヲチだけしてろ。

＞ののしるだけなら、おまいの頭のたかが知れている。

>>585
とりあえず、>>2-10 のリンク先のサイト全部読む。
で、そのリンク先に書いてある事が理解出来たら、
自分が穴掘って隠れたくなる様なアホな質問をしたって事が分かると思うよ。

>586
>フォントサイズ変えると場所がずれるから
この辺が、もう、どうにもあきまへんな。スタイルシートを何だと思とるんや。

ようするに、おまえら全員誰も適切に説明できないわけだ。
わからないなら黙ってればいいのに。必死になって恥ずかしーw

やれやれ。能無し君向きの簡単な質問じゃなかったから癪に障ったのかい。
まず、おまいが>>2-10まで読んで出直してこい。
>フォントサイズ変えると場所がずれるから
はあ？　フレキシブルレイアウトで絶対指定すればズレるだろうが。
フォントサイズを変更してもブラウザのサイズを変更してもズレる。
まさか固めろとでも？　固めたってモジラではフォントサイズは変更できる。

質問です。
<div id=screen>の幅と高さを、ブラウザ画面一杯にしたいのですが、どのように指定すれば良いでしょうか？

#screen{
position: absolute;
top:0; left:0;
width: 100%;
height:100%;
}

これでも画面一杯になりませんでした。

>>597
ttp://www.mozilla.gr.jp/standards/webtips/webtips0032.html
次スレ以降FAQに入れたいから誰かうまい文章考えてくれない？
俺も考えるけど。もしくは入れる必要がないならそういってくれ。

親子共々１００％

>>598
なるほど！わかりました、ありがとうございます。
FAQにあるといいですね。

>>596
>はあ？　フレキシブルレイアウトで絶対指定すればズレるだろうが。
要するに、君が％指定で満足に組めないだけだろ。
ズレるのズレないのって、縦横自在のウェブ・デザインで固めたがるのがそもそも笑止。

能無しは藪睨みしかできないもんらしいな。おまえﾘｱﾙでｳﾞｧｶだろ。

メインフローの中に無関係要素を書き込みたくないから、余計物をソースの下にまとめ書きして、
それをdivで指定した位置にターゲットではめ込めたら便利だろうな、
余計なモノを挟み込むとCSSが無効で素のHTMLが表示されたときに見苦しいから、
という話をしたんだろうが。分かってんのか、能無し君。
position:absoluteじゃ崩れるからできないとはじめから断ってんだよ。
CSSでレイアウトしてキレイなのは当然、
素のHTMLもキレイなほうがいいだろ。

onfocus="this.blur()"←これをリンククリック時に点線を出さないため使っていますが、CSSで設定できないでしょうか？

http://64.233.179.104/search?q=cache:9jOSIf8lS0IJ:beta.b.hatena.ne.jp/1059110803+onfocus%3D%22this.blur()%22%E3%80%80%E3%82%B9%E3%82%BF%E3%82%A4%E3%83%AB%E3%82%B7%E3%83%BC%E3%83%88&hl=ja&lr=lang_ja

↑で見た限り無理そうなのですが、ご存知の方いましたら教えてください。

>>585
空のdivが「きれいなHTML」だとはとても思えないけど。
それはおいといてどういうことを試したんだ？

質問です。

#layer{
position:absolute;
top:0;
width:635px;
height:100%;
}

このレイヤーを横方向の中央に持ってくるにはどうしたらいいですか？
text-align:center; とすると、レイヤー内の文字だけセンタリングされました。

>>603
outline。ただしWinIEは対応していない。
個人的にはリンクを確認しづらくなるのでやめたほうがいいと思うが。

>>605
F・A・Q！ F・A・Q！ >>6

>>606　レスありがとうございます。
あの点線に色をつけるとかで色々試行錯誤してみたいと思います。

>>607
ありがとうございます。FAQ>>6で大分参考になりましたが、どうしてもセンターに寄りません。
absoluteにしてしまうと、横方向だけセンタリングというのは無理なのでしょうか？

<div align=center style="
background-color:red;
position:absolute;top:0;
margin-left:auto;
margin-right:auto;
width:400px;
height:100%;
">SCREEN</div>

>>609
left: 50%;
margin-left: -318px;

>>604
話をごく簡単にして、二列組のHTMLの構造が下のようだとするだろ。

<div id="左">本文</div>
<div id="右">
（邪魔者要素）
端書</div>

邪魔者を最初に右に出して、左、右とフロートさせれば文章のあいだに
邪魔者が入らないとは言わないでくれ。実際はもっと錯綜しているのだ。

CSSでレイアウトする分は問題ない。きれいに処理するよ。
しかしCSSが効かない環境では文章のド真中に邪魔者が居座るわけだ。
これはあまりに見苦しい。そこで、

<div id="左">本文</div>
<div id="右">
<div id="邪魔者"></div> ←空div
端書</div>

として、</body>の直前あたりに書いた余計なタグをdiv targetでid=邪魔者に
埋め込めれば、CSSが効かずに素のHTMLが表示されたときにも
本文のド真中に邪魔者が居座るような見苦しいレイアウトは避けられる。
素のHTMLが表示されてキレイ、ソースの見た目もキレイだぞ。
フロー別にソースをまとめられるわけだから。
そんなCSSはいまは無理でも次の時代はできますか、と事情通に尋ねたのよ。

>>602　罵倒に語を費やす前に、舌足らずな説明能力を反省しなさいね。

みんな色々工夫してるんだねぇ

だから、空divのどこがキレイなんだか。>>611
内容生成ならcontentプロパティーか、さもなきゃJavaScriptとかの仕事だしな。

>>611
要するに、ソース上では

本文
端書
邪魔者

という順に現れるのを、

本文｜邪魔者
　　　├───
　　　｜端書

というふうに表示させたいのか？
邪魔者と端書の高さは可変で。

>>610
すごい！できました。多謝。

俺の説明は完璧なので、言いがかりを付けられるいわれなど無い。
お前らの日本語読解能力が異常なだけ。

あ、ここに日本人はいなかったのか！
どうりで納得。
度を超えたレベルの超絶バカばっかりだから、日本の将来は大丈夫なのだろうかと心配しちまったよ。ははは

↑
納得、解決済み

次の質問どうぞ
↓

>>615
そう。そういうやつが1ページ内に数箇所あるんだね。だから、
下に邪魔物を一まとめにすれば、メインフローはまさに「コンテンツ」だけになって
とってもいい感じだろ。特に、こっちで用意したCSSが効かない状況では。
>>614
空divが超キレイとは言わないが、コンテンツの合間合間に数十行に及ぶ
本文とは関連しないタグ、スクリプトが入ると見苦しいし、
読みにくいだろ。ソースも、素のHTMLも。キレイなのはCSSで整形した後だけだよ。
こういう場合、スクリプトのお出ましというのはよく分かるよ。でもねえ、
レイアウトの問題なんだから将来はCSSでできるようになればいいなあ、と。
position:absoluteがオッケーなら div target もあっていいでしょ。

text-align は横方向ですが、縦方向のtext-alignを指定するプロパティーは何ですか？

＞text-align は横方向ですが

m9（^Д^）ﾌﾟｷﾞｬー

<div align=center style="
background-color:red;
position:absolute;top:0;
margin-left:auto;
margin-right:auto;
width:400px;
height:100%;
vertical-align:50%;
">SCREEN</div>

vertical-align:50%;を入れても、SCREENの文字が中央に来ません。どうしたら中央に来ますか？

<div align=center style="
background-color:red;
position:absolute;top:0;
left:50%;
margin-left:200px;
width:400px;
height:100%;
vertical-align:50%;
">SCREEN</div>

一部　古いプロパティのままだったので書き直しました。
SCREEN文字を縦方向にも中央に置きたいです。

>>619
何だか知らんが、本文と関係ない邪魔者をそんなにも差し挟むのがレイアウトの問題か？
サイト設計とhtmlからやり直せ。
スクリプトなんてsrcで参照すれば一行で済むだろ。あほか。

>>623　坊や、ＦＡＱも見ないで質問してはいけませんよ。

ところでＦＡＱって何て読むの？

言葉責めですか。

ファッキュー

>>619
慶応大学行って来い。　　　　　意味解るよな？

I FAQ

>>626
http://ja.wikipedia.org/wiki/FAQ

<table>に display:inline を使ってなんとかFirefoxでも同じようにできそうです。
�dクス。

　|---------------|
　|　　　　　　　　　 * |
　|---------------|
　| ああああああ |
　| ああああああ |
　| ああああああ |

中央寄りに作られたボックスの
*の位置に 「CONTACT」という文字を持ってきたいとします。
しかしHTML上では「ああああ」よりも後に
<div class="header">
<a href="contact.html">CONTACT</a>
</div>を書きたいので、
絶対位置指定で

.header{
positon:absolute;
top:20px;
}

この様に書きました。
こうするとうまく*の位置にCONTACTが入ったのですが、
ウィンドウを横に広げた時に、縦の位置はいいのですが
横の位置は固定されたまま動きません。

中央寄りになったボックスで、絶対位置指定で*の部分に
CONTACTを持ってくるにはどうすればいいでしょうか？

ずれました。こうです
　|------------|
　|　　　　　　　  * |
　|------------|
　| ああああああ |
　| ああああああ |
　| ああああああ |

>>633
絶対位置指定など使うまでもなくtext-align: rightじゃいかんのか？

>>635
そうすると*の位置にCONTACTが上がって来ないんですよ。
CONTACTは「ああああああ」よりも下に記述されているので、
そのまま「ああああああ」の下に書き込まれます。

>>636
何でそういう構造になってるのかがわからんが
絶対位置指定とtext-align: rightを同時に指定すればいいのでは。

>>637
絶対位置指定もtext-align:rightも指定してるんですけど
ウィンドウ横幅を広げた時に、CONTACTが
ボックスの外にハミ出してしまうんですよ。width無視されるし・・。

スタイルシートを切った時に、CONTACTが一番上に来られると困るので
下に書きたくこういう構造になってます。

今はどういう風に書いてるんだよ

ttp://EAOcf-526p83.ppp15.odn.ne.jp/
ｗｗｗｗｗｗｗｗｗｗｗｗおｋうはっｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ
ｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ
うぇｗｗｗうぇうはっｗｗｗｗｗｗｗｗｗｗｗｗ
うはっっおｋｗｗｗｗｗｗうぇｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ

>>639
#contact{
float:right;
width:760px;
text-align:right;
position:absolute;
top:25px;
}

OSX IE5.2 safari1.2.3を使用しています。
hタグで囲んでスタイルシートで行間調整しているのですが、
safariで見ると行間がものすごく開いてしまいます。
これはどうしようもない現象なんでしょうか？

<h1 class="css">文字</h1>

cssには{line-height: 14px;font-weight: normal}とスタイルシートで調整しています

>>642
多分line-heightの問題。
ボーダーなり背景色なりを変更して確かめてみれ。

WinXP IE6です。
li要素に「display:inline;」と指定して、リストを横並びにさせたいのですが、
マージン・パディングを0にしても、「list-style:inside;」にしても、
要素と要素の間が開いてしまいます。どうにか出来ないでしょうか？

>>644
vertical-align: bottom;

>>645
オマイって奴は・・・

>>644
<li>hoge</li><li>hage</li>...

>>641　floatとpositionの同時指定は無意味だから止めい。

>>641
>>633を見る限りid="contact"なんて見当たらないが？
とりあえず
>中央寄りに作られたボックス
にposition:relative;
.headerにposition:absolute:top:0;right:0;で右上に来ないか？

contact（笑）

>>649
全然駄目です・・　ちょっと整理しました

HTMLソース-------
<div id="header">
</div>

ああああああ

<div id="contact">
CONTACT
</div>

CSS---------------
#header{
margin: 30px 0px 0px 0px;
width:700px;
height:30px;
}

#contact{
position:absolute;
top:0px;
right:0px;
}

こうするとheaderのボックス内に入らず、
ページの右上隅にCONTACTが来てしまいます。
positionをrelativeにすると、「ああああああ」の下にCONTACTが来てしまいます。

>>651
ああああああはどんなタグで囲まれてるの？

>>652こんな感じです

<div id="aaa">
ああああ
</div>


#aaa {
text-align:center;
width:760px;
margin-right:auto;
margin-left:auto;
}

>>651
#headerって内容はないの？だとしたら存在意義がわからないんだけど。
ま、それはともかく、#contactの幅が760pxと決まっているのなら
(>>633から察するに#aaaと同じ幅なんだよね？)

#contact {
position: absolute;
width: 760px;
left: 50%;
top: 0px;
margin-left: -380px;
text-align: right;
}

でいいんじゃない？

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
<!--
#container {background-color:#eee;}
#aaa {background-color:#eeffff;}
#header {background-color:#ffeeff;}
#contact {background-color:#ffffee;}
body {text-align:center;}
#container {width:760px;margin-left:auto;margin-right:auto;position:relative;text-align:left;}
#header{width:700px;height:30px;}
#contact{position:absolute;top:0;right:60px;}
#aaa {width:760px;}
-->
</style>
<title>test</title>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="aaa"><p>あああああああああああ</p></div>
<div id="contact"><a href="contact.html">CONTACT</a></div>
</div>
</body>
</html>

>>654-655
おおおＯＫです！！！バッチリボックス内に来ました！
どうもありがとうございました！！

質問です。

似非フレームを使ってページ全体を縦に3分割しています。
Opera使って閲覧すると、ページ自体のスクロールバーが出てこなくなりますが、
何故か一部のページだけ下にスクロール出来るようになり、真っ白なページが永遠と表示されます。

HTMLの構造は全く一緒で内容が違うだけです。強いて違いを上げるならば、縦に長いページだという事くらい。
OSはWINXPです。

>>657
あんたがどうやって擬似フレームを作ったのか言わなきゃ誰もわからないわさ。
あと関係ないが「永遠と」→「延々と」

>>657
エセ・フレームだからじゃねーの？

ぎじ【疑似/擬似】

本物と区別のつけにくいほどよく似ていること。

えせ【〈似非〉/〈似而非〉】

似てはいるが本物ではない、見せ掛けだけの、の意を表す。
劣っている、価値のない、の意を表す。

の差では？

つか、その説明で、どーゲイイン（←何故か変換出来ない）を言い当てろと？

>>658
body{margin: 0;height : 100%; color:
左#header{
color: white;
width:19%;height:100%;
position: absolute; left: 0px; top:0px;overflow: hidden;
background: black ;}
まんなか#index{width:62%;height:100%;
position:absolute;left:19%; top:0px ;overflow:auto;
background-color:white;}
みぎ#footer{color: white;
width:19%;height:100%;
position: absolute; left: 81%; top: 0px; overflow:hidden;
background: black;}
です。

>>660
えーと、一行目？

ｽﾏｿ、ﾐｽ
body{margin: 0;height : 100%; color: black;}

>>660
全てposition:absolute;（ついでにoverflow:hidden;）でどーしろと？

>>655-656　空divは感心しないナ。それでいいのか？

現状のCSSでは、IE対応状況なんかも考えるとある程度の空タグや（nbsp;を入れても良いけど）入れ子
は仕方が無いジャン？

まあそれはそうだが>>655の場合は別に使う必要ないやろ。

入れ子は（或る程度まで）仕方無いが、空divは不要だ。
中身のない<div></div>と&nbsp;とは到底一緒にできん。

じゃあどうやって実現する？

ああ・・・ごめん、枠画像とかやってるわけじゃないのね。
めんどくさくてソース良く見てなかった(^ω^； )ゝ

>>664
書かれていないだけで空じゃないのかも、と思ったので>>655のように書きました。
僕も空divは不要だと思っています。
#containerの上部にpadding取るだけで解決する内容ですし…。

>>643
行間が広がっているのはわかるのですがline-heightの値を小さい値に変えても変化がないので
そういう仕様かと思ったんです。
これ以上狭くするのは無理なのかな・・・

すいません。行間って言い方は違うかもしれません。
<h1 class="css">文字1</h1>
<h1 class="css">文字2</h1>
と書いた時文字1と文字2の間が広がってしまうということが言いたかったんです。

ＣＳＳはＩＴ業者の延命のための陰謀である。

ＷＥＢ制作はソフトの進化により素人でも間単になった。
ＩＴ業者は価格低下に苦しんだ。
そこでＨＴＭＬより敷居の高いＣＳＳを普及させることにより、
ＷＥＢ制作を専門業者の独占事業にしようとしたのである。
これはインターネットの思想とまっこうから対立する。
我々はＣＳＳに断固反対し、一切使うのをやめることで、
ＣＳＳの普及をくい止めなければならない！

>>672
それはマージンを調整

ありがとうございます。
h1{margin:0px 0px 0px 0px;}と書いて狭くできました。
この方法↑が正しいかは分かりませんが、とりあえず解決できました。

>>675
margin: 0;　で十分かと。

>>673
>そこでＨＴＭＬより敷居の高いＣＳＳを普及させることにより、
>ＷＥＢ制作を専門業者の独占事業にしようとしたのである。

敷居高いか…？ｗ

フロートによる段組をする場合
クリアをしないといけないとありますが

<div class="wrapper">
<div class="floatleft">
...
</div>
<div class="floatright">
...
</div>
<div class="clear"></div>　　←ココ
</div>
こうするのと

<div class="wrapper">
<div class="floatleft">
...
</div>
<div class="floatright">
...
</div>
</div>
<div class="clear"></div>　　←ココ

こうするので、何か違いはありますか？
イメージ的には2列のboxができるものとしてください。
どちらかが正しい文法とかありますか？
よろしくな、おまえら。

>よろしくな

　　やだ

>>679
全然違う。試してみればわかると思う。
あと、どうせ空要素つかうなら<hr>とかにしておいた方がまだましかと。

今のままでは両社とも文法的にはダウト。

>>679
あと、最後の一行は

おまえら、よろしくお願いします。

とすると感じよかった。

>>680
解決策をご教授下さい。
テメエよ、よろしくおねがいします。

>>682
解決すべき問題がないじゃん。

>>683
どちらの記述がよくて
どういうクリアー方法がありますか？
教えてください、(´･ω･`)ﾃﾒｴ！

>>684
m9(＾Д＾)ﾌﾟｷﾞｬｰ

そんなにテメェが言いたいか

どいつもこいつも質問の仕方が下手なので、丁寧で、なおかつ確実に回答をもらえる質問の仕方を教えてやるよ。

　どちらの記述がよくて
　どういうクリアー方法がありますか？
　14歳の女子中学生ですが、どうぞよろしくお願いします。

覚えとけ。

>>687
うｐ！うｐ！

14才ではありませんが
一応女でつ･･･

まあまあ若い方･･･？

ネタ質問乙

次の質問ﾄﾞｿﾞｰ↓

>>684
>>680 にも書いてある（ように読める）けど、
文法（謎）に気を配るなら、<div>は空要素になりえないから、
<br />とか<hr />とか<img src="" />とかその辺を使うのがいいんじゃないかとおもった。

>>691
そもそも <div></div> は文法上、何も間違ってないのでは?
ISO-HTML では禁止しているけど、XHTML では XML の仕様上、
可能な内容に #PCDATA を含むなら、0 文字の #PCDATA として
空になりうる。

ただし XHTML 1.0 では空要素でない要素に対して、たとえ内容が
空であっても <div /> のような書き方はすべきでないとしている。

<img src="" /> は自分自身の URI を画像として参照することになる。
src="" と書くこと自体は文法違反ではないが、実用上ありえない。
それに alt は必須なので省略できない。

ブログやってます。
テンプレートの中のCSSをいじってるのですが下記の点が分かりません。
引用する時に指定するブロックで

blockquote {
margin: 3px;
padding: 20px;
background-color: #fafoe6;
border: 1px dashed #FFA500;
}

というのがあって枠線やその破線の指定などは分かったのですが、
背景色が WIN XP&IE 6、MacOS9&NS6/NS7、では反映されません。
MacOS9&IE5.17では指定通り背景色がちゃんと付きます。
上記では破線しか反映されず見にくいので、
ネスケはともかく（すみません）WIN&IE6の人がほとんどなので
そちらにはきちんと見せたいのですがどうしたらいいでしょうか。

背景色は薄いオレンジにしていて（地の文章のバックは灰色）
「引用」とはっきりわかるようにしたいのです......。

>>693
background-color: #faf "o" e6;

background-color: #fafoe6;　←　ｏオーじゃなくて０ゼロだろ？

>>694,>>695
即レスどもです。

もう、穴があったら入りたいっす.......orz
御指摘通りでした......。
今ゼロに修正してみたら、ネスケ6&7ではOKでした。
WINは今手許にないので明日確認します。（大丈夫だとは思いますが）

ちなみにあと一点いいですか？
このケースで（僕はMacOS9&IE5.17）なのですが、
ゼロではなくオーで背景色が付いていたというのは
何故なのですか？ﾏｸのブラウザが勝手に（この場合は良い方に）
解釈（これはオーじゃなくてゼロだろヴォケ）して
付けてくれたということなのですか？
もしそうなら痛し痒しですね。
エラーならエラーで反映しない方が「あれ？」と思って
も一度HTMLやCSSを見直すのですが。
（ﾏｸじゃなくてｳｨｿで確認しろ、は勘弁して下さいね...）

> 何故なのですか？ﾏｸのブラウザが勝手に（この場合は良い方に）
> 解釈（これはオーじゃなくてゼロだろヴォケ）して
> 付けてくれたということなのですか？

そういうこと

>>697
そうですか。やっぱそうですよね。
重ね重ねありがとうございました。

>>696
墓穴に入ってください

font-size: 8pt; までは font-weight: bold; が効きますが、7ptにするとboldになりません。
7ptでもnoramlとboldで差を付ける方法はありますか？

noraml

>>700
ただたんにフォントが小さくなって画面上で区別がつかないだけじゃね？

>>700
その書体にそのサイズでのboldがないんでしょ。

クラスセレクタではなくIDセレクタを使うメリットって何なんですか？
「ページ内の唯一の内容にスタイルを指定するために使う」と言う記述を
よく見ますが、その唯一の内容にだってクラスセレクタ使えますよね？

記述する人の分類とかね。
リンクで飛べるし。

うちのサイトも、ヘッダ、メイン、フッタ、とかそういうのはidつかって、
そのなかのパーツはclassでやってるよ。

俺流マークアップだ

全部クラスで問題ないなら、クラスでやっちゃえばいいじゃない

>>705
そう言う事ですか。ってことはIDセレクタでなければできない事なんて
無いんですね。ようやくスッキリしました。レス感謝します。

>>706
>>575

>>706
精細度をガツッと上げたいときに使うことが、たまーにある。

>>707
教えていただいたレス付近を眺めてみました。
内容が難しすぎて半分も理解できていませんが
更にスッキリしたような気がします。

まりがとう。

>>708
精細度ですか・・。勉強させていただきます。

皆さんご親切にありがとうございました。
ここは良いインターネットでした。

>>710
「精細度」はレスのなかで最も問いとの関係が薄いような…

「精細度＝同じスタイルを複数の場所に適用せず、すべて別の設定をする」
という意味なら、classをそれぞれ一回ずつ使っても同じなんだし

「精細度」　使ってみたかっただけと違うのか？　なあ弥七！！

「精細度」も悪よのう　くひひひ

弥七 は「越後屋」とちがうんでねーの？

じ〜んせいらくありゃく〜もあるさ〜〜

以下の二つのファイル(file1,file2)によって構成されたHPは、
段組が中央に表示されています。
これを左に寄せて表示するには、どの部分を修正すればよいですか。
だいぶ長いですがお許しを。

file1-1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>2 columns, fixed size, centered</title>
<link rel="stylesheet" href="base.css" type="text/css" media="screen" />
<style type="text/css">
body { text-align:center; }
div#outerContainer { width:50em; margin-left:auto; margin-right:auto; text-align:left; }
div#left { float:left; width:35em;}
div#right { float:right; width:14em;}
div#footer { clear:both;}
</style>
</head>

file1-2
<body>
<div id="outerContainer">

<div id="header"><h1>2 columns, fixed size, centered</h1>
<code>div#header {<br />}<br /></code><br />
<p><a href="http://www.mentalized.net/cssdepot" title="CSS Depot">«Back to the CSS

Depot project</a></p></div> <!-- #header -->

<div id="left">
<h2>Left</h2><code>div#left {<br />float:left;<br />width:35em;<br />}<br /></code>
<code>body {<br />text-align:center;<br />}<br /></code>
<code>div#outerContainer {<br />width:50em;<br />margin-left:auto;<br/>marginright:auto;<br

/>text-align:left;<br />}<br /></code>
<div class="filler"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam

nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p></div>

<!-- .filler --></div> <!-- #left -->

file1-3
<div id="right">
<h2>Right</h2><code>div#right {<br />float:right;<br />width: 22em;<br />}<br /></code>
<div class="filler"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam

nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p></div>

<!-- .filler --></div> <!-- #right -->

<div id="footer">
<h2>Footer</h2><code>div#footer {<br />clear:both;<br />}<br /></code>
<p>This file is part of the <a href="http://www.mentalized.net/cssdepot" title="CSS

Depot">CSS Depot project</a>, and is licensed under a <a

href="http://creativecommons.org/licenses/by/1.0/">Creative Commons License,

"Attribution"</a>.</p></div> <!-- #footer -->

</div> <!-- #outerContainer --></body></html>

file2-1
/* This style sheet sets up colors and font face and the like.
NO box layout is done here, see the invidual files for that.*/
/* Setup block colors */
div#header { background-color:#FFAAAA; }
div#left { background-color:#FFFFAA; }
div#middle { background-color:#AAFFFF; }
div#right { background-color:#AAFFAA; }
div#footer { background-color:#FFAAFF; }
div#innerContainer { background-color:#F0F0F0; }
div.filler { color:#808080; }

file2-2
/* General look'n'feel styles */
body {background-color:white; font-size:80%; margin:1em; font-

family:'Georgia','Times','serif';line-height:1.5em;}
h1 { font-family:'Trebuchet MS','arial','sans-serif'; font-size:1.6em; margin-top:0;}
h2 { font-family:'Trebuchet MS','arial', 'sans-serif'; font-size:1.2em;margin-top:0;}
h3 { font-family:'Trebuchet MS', 'arial', 'sans-serif'; font-size:1em; margin-top:0;}
table { margin-bottom: 1em; }
table tr td {background-color:#F0F0F0; padding:0 1em;}
p { margin-top:0; margin-bottom: 1.5em;}
/* Let's make sure code is readable in other browsers than IE too */
* > code { font-size: 1.25em; }
img#license { float: right; }

以上です。よろしくお願いします。

div#outerContainer { width:50em; margin-left:auto; margin-right:auto; text-align:left; }

>>716
「勉強するのは嫌だから、おまえら教えろ。」　ってか。

パクるつもりだろうが、解るように勉強する気はないのか？　なあ弥七！！

ここをどう修正すればいいのでしょうか。

パクパク、パックン、ゴックンチョ、ってかw

>>723
>>722

>716もワルよのう。

body { text-align:center; }
ここを変えてみたのですが、うまくいきません。

>>723
>>721見てわかんなかったら黄門様に頼むしかないな

>>727
ああそこも要るね

>>729
この二つを直せばいいのですね。
意地悪しないでお願いします。

いやむしろ
img#license { float: right; }

>>730
「魚を与えるより釣り方を教えろ」っていうじゃないですか？

パクリ屋　お前には無理だ。背伸びをしてはいけません。　なぁ弥七！

CSSのダウンロード出来るマニュアルというのは何処にあるのでしょうか？
英語版でもそれらしいものが見つからないのですが-;

http://www.w3.org/Style/CSS/

>>730
自己解決しました。
body { text-align:left; }
div#outerContainer { width:50em; text-align:left; }
でOKでした。
参考になったサイト
http://www.keynavi.net/ja/bugh/css_misc.html
■ブロックがうまく表示されない

これでまた一人の人間が成長した
ふう、憎まれ役も大変だ

質問。
Amaya started as an HTML + CSS style sheets editor.
(Amaya公式サイトから抜粋)

"CSS style sheets" って何のつもり？
カスケーディングスタイルシートスタイルシートだって。

ｽﾀｲﾙｼｰﾄってそんなに必要か？

けっこう便利

>>739
解らない馬鹿は黙ってて下さい

>>741
いやまぁ、そう脊髄反射されても困るんだがw

ウェブ製作はDWを利用してしまっている事から、
いまいち恩恵部分を実感していないと言うか・・・

皆、手打ちなの？

ちなみに、
ソーテック社の
HTML & スタイルシートレイアウトブック
ってのを立ち読みした

意外に分かりやすく、
ちょいと買ってみようかとも思ったけれど、
手持ち金がなく帰宅

>>738
スタイルシートの1種類としてのCSSを強調してるんじゃないか、と無理やり弁護してみる。
いや、俺もおかしいとは思うけどね。

>>742
DWで物理タグを使ってか・・・　　おめでてーな。

だって初期設定がそうなんだから、しょうがないじゃん。
「インデント」ポチッと押すとblockquoteですよ。いまだに。

しょうがなくない

手打ちにこだわる奴は初心者

誰も手打ちとは言っていないが・・・

>>742
古いＤＷ？

マカロニウエスタンじゃあるまいし

>751
あのー　むこうのｽﾚ　寂れてるんですけど・・・

お前ら詳細度

>>750
違うっしょ
新しいDWゆえに、cssを実感出来てないんじゃない？

だから、手打ちなのか？と聞いていると思われ

リンクで#つけてページのある部分に飛ぶためのIDは、
別にCSSファイルにそのIDのことを書いてある必要はないですよね？

なに言ってんだ喪前は

>>755
自動翻訳みたいな文だな

>>755
必要ない

DWの話題が出ましたね。漏れもここ2、3日MX2004触らせてもらって
いるんだけど操作が複雑でくじけかけています。
CSSスレの住人さんってプロ、もしくはプロはだしが多い気がしますが
そんな皆さんはどんなエディタ使ってますか？

スレ違い

>>759
まぁ、あの複雑な画面構成と、ワケのわからん操作用語は
慣れないとピンとこないだろうね。
まぁ半年くらい使えば慣れるよ。

>>761
半年かぁ。慣れる前に心が折れて夜な夜な飲みに行っちゃいそう・・
もうちょっとがんばってみます。

そんなにめんどいかぁ？
１週間も遊んでれば覚えると思うんだけんどねぇ・・・

きっと>>761は漏れの文章から滲み出るアフォさを
感じ取ったんだと思います。オーズ

質問です。

<style>
div.left {
width:20px;
height:100%;
background-color: red;
}
</style>

<div class=left></div>

ページ右の縦方向の帯です。。
ページが長くなると、下にスクロールしたときに帯が消えてしいまいます。
不特定な長さのページの一番下まで帯を伸ばすには、どうしたらいいですか？

×　ページ右
○　ページ左

body { border-left:20px red solid; } じゃだめかいな？

>>767
パーフェクトです。ありが�d

<dt><dd>を使って整形しているのですが
<dd>の文章が二行目に入った時、一行目文章だけが若干右にずれます。
これを修正する方法はありませんか？

767の方法で、色帯だけならいけたのですが、帯に画像を使おうとするとborderだけではだめでした。
<div>でページの下まで縦に伸ばす方法があれば教えてください。

border;1px solid blue;
とかでdivのブロックを見ればわかると思うが

>>769
ある。
ソースを見ないと詳しくはわからないが一行目だけってのがポイント。

>>770
html,body {height:100%;}
div#のばしたいやつ　{height:100%;}

>>772
あっ、text-indentか！
どうもです！

>>772
それにすると、最初の表示画面一杯にはなるのですが、下にスクロールすると途切れています。
スクロールしても一番下まで伸びるようにしたいのですが、適当な長さを決めて指定するしかないでしょうか？

>>774
それ、bodyでやればいいじゃん。

<div id="container">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
</div>
こんな感じで入れ子にしてるんだけど、IE6とNN7,Mozillaで表示が異なる。
"container"のマージン、パディングは０にしてるのに、NN7,Mozillaで"div1"
の上部に不明な領域が発生する。"div1"はspanタグ内を不可視にして背景画像を
挿入してる。こちらもマージン、パディングは０に設定してる。

"div1"を不可視にすると、下の領域が繰り上げられるけど、その時には
不明な領域は現れない。そのことから"div1"が原因だと思うんだけど
解決策がわからない。どうしたらいいでしょうか。

floatを使った場合　NN4.7は切り捨てないといけませんか

ＮＮ4ｘなんぞみんなとっくに視野に無い　

まじっすか　1日800万PVなんですが切り捨ておK??

>>779
NN4系はテキストブラウザとして扱う、と考えれば、
切り捨てていることにはなるまいて。

なるほど勉強になります
　内部で1%ルールがどうとかい言う人がいるので困ってました

>>775
767とは違う方法ですか？

>>765
親要素の背景と右側に来る要素の背景をうまく組み合わせて
左側の背景がずっと続いているよう見せかけろ。

ttp://hl.fpsjp.org/index.php
このサイトのように上に画像、ページの真ん中に文字を表示というようにしたいのですが
どのように設定すれば良いのでしょうか？

ageてしまった・・・。すみません。

>>785
別にageてはいけないなどという決まりはありませんが。
そのように分別なく謝るとことは、普通にageて書いている>>776さんのような人に失礼だとは思いませんか？

>>786
ageても良いのですか。
申し訳ありません。>>776には申し訳ないことをしてしまいました。

>>784 の上げているサイトのレイアウトを表現する言葉が、
＞上に画像、ページの真ん中に文字を表示
だというのがとても納得がいかない件について。

自分語は他人に理解できんということだな。

不適切でしたか。申し訳ありません。

>>784
簡単にやる方法は無いな。
DIVを使いまくって、いろんなところを設定しないと。

>>784
文書上部に、idがheaderであるdiv要素（ここでは便宜上#headerと表す）がありまして、
その中にはサイト名と思われるものがh2要素としてマーク付けされております。

サイト名を画像で表示させるために、まず画像を表示させる領域を#headerに確保しています。
（高さは指定していますが、幅は指定していません。それは、#frameに指定しているためです。）
そして、#headerの背景として、サイト名の画像を指定しています。
最後に、テキストのサイト名（h2要素）が表示されたままでは格好が悪いので、それを消しています。

#header {
height:80px;
background: url(topimg.jpg) no-repeat; }
#header h2 { display: none; }

本文は、idがframeである大きなdiv要素（便宜上#frame）に全て収まっています。
その#frameの幅を指定して、左右の空白をauto（自動）にしているので、本文全体がセンタリングされます。

#frame {
margin: 0px auto 0px auto;
padding: 0px;
border: 1px solid #333;
width: 750px;
background-color: #E6E6E6; }

上下に無駄な空白が表示されないように、body要素周りの空白（marginとpadding）を0にしています。

body {
margin: 0;
padding: 0;
background: #939393; }

ページの真ん中というのを、センタリングと解釈しましたが、いかがでしょうか？

>784には理解不能と思われ

font-size:x-smallより大きくてsmallより小さいフォントサイズ指定はありませんか？（数値指定以外）

>>792
親切かつ丁寧に御指摘ありがとうございます。
現段階では少し理解し難いので>>5のサイトをもう一度おさらいしてわからなければ
また質問させていただきます。お世話になりました。

>784は真面目な人だな。
こういう人はすぐに出来るようになるよな。

784＝796
釣り師

ただのアホ

真面目な釣り師
だが必死ｗ

質問させてください。よろしくお願いします。

テキストを画像に置き換える方法として
text-indent : -9999px ;
があると思うのですが、これにページ内リンクを張ったとき、
firefoxではテキストが見えず画像だけの時でもジャンプできるのですが
IEでは選択はできますがクリックしても飛ぶことができません。

そういう仕様なのでしょうか？　それとも他にやり方がありますか？

>>800

こういうのは？

<div id="link1"><span>LINK1</span></div>
---
div#link1 span { display:none; }
div#link1 {
width:80px; height:31px; bakcground-image : url(link1.gif);
background-repeat: no-repeat; backgournd-position: top left;
}

>>801
ありがとうございます。仕様っぽいのでそうすることにします。

>>794
ない。
smallやx-smallをmediumに対してどれくらい小さくするかは、
UserAgentの勝手だから。
(仕様書上な推奨値はある。知りたきゃ仕様書嫁)

body{
font-family: ＭＳ Ｐゴシック,Osaka;
font-size: 10pt;
color: #FFFFFF;
line-height: normal;
background-color: #00CCFF;
background-image: url('./bg.jpg');
background-repeat: no-repeat;
background-attachment: scroll;
background-position: right bottom;
}

a:link div.list{
background-image: url('aaa.gif');
background-repeat: no-repeat;

}

a:hover div.list{
background-image: url('aaa-1.gif');
background-repeat: no-repeat;
}

<div>
<div class="list"><a href="あああ">あああ</a></div>
<div class="list"><a href="いいい">いいい</a></div>
</div>

リンクにマウスを乗せたらリンクの背景画像が変わるようにしたいのですが
画像すら表示されません。
どうしてでしょうか？

a要素の子要素にdiv要素など存在しとらんだろが

>>804
なぜ基礎を知らないまま試し、基礎を確認せずに質問するのでしょうか

ｱﾎｱﾎﾏﾝだからで〜〜し

試すのはいいんでないか。

試すのは勝手だが基礎知識は必要だろ。

>>804
div.list　a:hover {
background-image: url('aaa-1.gif');
background-repeat: no-repeat;
}

これでやってみて

誰かたすけて〜。内部スタイルシートから外部スタイルシートに書き出してみると、バグります（レイアウトが崩れる）。内部ではうまく表示されているのを確認済ですが。
ドリウェバで外部に書き出しました。また、他の方法で新規ｃｓｓでコピペすると、こんどはｃｓｓに組んだ画像が読み込めていません。
なにが原因でバグっているのかさっぱりです。

ウェバなんてのは知らないな。

>>811
url晒すかソースを書いてみるか、とにかく情報を出せ。今すぐすべてを出せ。
でないと、わからん

ｻﾛﾝ　パス

>>813
脱がなくてはいけないの？

パンツは許す…

質問を書いて安心をするスレはここですか？

＞＞８１３
すみませんでした。
url=http://cyber-bridge.com/chugokuseira
とりあえずみてください

ウイルス及びブラクラについて

>>818
cssファイルは、css/に入ってるわけでしょ？
画像の指定で、（img/ファイル）になってるけど,（．．／ｉｍｇ／ファイル）にするとか？

>>820
ありがとうございます。やってみたところ
無事表示されました。ひと安心です(^_^)

画像はクリア
あとは、レイアウトが崩れる原因かね？

３分後にパスと書かれても気が付かないとは・・・

ワロﾝﾊﾟス

>>821
まず HTML を直した方がいい。
<div> に <li> は入れられない。<a> に <div> は入れられない。

関係ないと思うけど、外部 CSS には @charset を入れないと駄目。
url 関数は url( ) ではなく url(" ") と書いた方が安全。
フォントファミリ (キーワード以外) はすべて " " で囲んだ方が安全。

>>825
@charsetないと駄目なんて決まりは無い。
レスポンスヘッダでcharset指定できない場合に代替として使えるだけ。

>>805-809
確かにしっかり確認せずに質問した漏れが悪かったと思う　スマソ

>>810
ありがとう、でもマウス乗せてない段階でも画像が表示されてないorz

もうすこし勉強してみまつ

応用ってものを知らんのかいな・・・

まぁまぁ　助さんや、教えてあげなさい。

叩き斬れぇ！

ご隠居ー・・・？　　

　ご隠居鬼になっちまいましたよ　格さん。

cssでレイアウトしていると、印刷時に崩れることについて教えてください。

現在、ブログっぽい2列のレイアウトにしています。
body幅が700pxくらいで、一番上にヘッダーがあって
メインが550px、サイドバーが150pxみたいなよくあるやつ。

で、これを印刷用CSSでそのままだしたいのですが、
縦に長いページで、A４で一枚半くらいになります。
そうすると、一枚目はいいのですが2枚目が紙の途中くらいから始まってしまいます。
これを、2枚目も一枚目の続きとしてきちんと紙の上部から印刷したいのですが
どうすればいいんでしょうか？

レンダリング上、左上から順番だろうからしかたないのでしょうか？
それとも、印刷時の改ページをいちいち指定する方がいいのでしょうか？

ブログだと普通に全部つながった状態で印刷されますよね？
どうやっているのでしょう？宜しくお願いいたします。

以下のように記述すると、Firefoxでは幅がちゃんとピッタリになるんですが
IE6だと十数px広くなっちゃうんです。
どうすれば同じ記述で表示も同じになりますか？

<div class="main">
<div class="index">
<h2>Contents</h2>
<ul>
<li>****</li>
<li>****</li>
</ul>
</div>
**中略**
</div>
----------------------------
div.main div.index ul {
width:148px;
margin:0px;
padding:0px;
border:none;
text-align:left;
list-style:none;
color:#333; }
div.main div.index ul li {
width:138px;
margin:0px;
padding:0px 5px;
border:none;
text-align:left; }

>>932
ヒント：media="print"

>>932 がんばれ。

>>932 がんばれ。

がんばるっす

質問です。

<div style="border: solid 1px green;text-align:center;">
<img src="a.jpg">
<img src="b.jpg">
</div>

高さの違う2枚の画像をdivの中で横に並べています。
高さの低い画像は、divのbottomに合っていますが、縦方向にdivの中央に持ってくるにはどうしたらいいですか？

ヒント：垂直 英訳

そんなときのためのvertical-align

>>839 ごめんなさいごめんなさい ○|￣|＿

>>839-840
レスありがとうございます。

そう思って
<div style="border: solid 1px green;text-align:center;vertical-align:middle;">
にしてみたのですが、やっぱり中央に来ないんです。どこか書き方が間違っていますか？

sinekuzudomo

>>842
vertical-alignがどんなプロパティでどういう要素に適用可能なのかよく調べよう。
「こうすればできそう」という自分の思い込みだけで終わるな。

vertical-alignは画像にも入れてみたりしたのですが、中央に来ない画像だけに入れていたのでだめだったようです。
両方の画像に入れたら中央に来ました。
ありがとうございました。

テキストを画像に置き換える方法として、text-indentを使って画面外に飛ばす方法がありますよね。
h2{
text-indent: -9999px;
margin: 0 0 10px 0;
width: 580px;
height: 41px;
}

うぁ、間違えた…

h2{
text-indent: -9999px;
width: 500px;
height: 30px;
　　　　　　　background: url(img/h2.jpg) no-repeat 0 0;
}
例えばこういう方法がありますが、この方法だとWinIE5.0だと背景まで画面外に飛んでしまうんですが、良い解決法は無いでしょうか？

やはりtext-indentを使わずに、
padding: 30px 0 0 0;
height: 0（IEは30px）;

にするのがベストかなぁ。

h2のテキストに全角スペースを使う

font-size:0;

回答者のラベルが低すぎるぜ！

>>849
他のブラウザだとそれでも良いんですが、IE5.0だと豆みたいな文字が見えてしまいます。
colorにtransparentがあれば簡単に解決できるのになぁｗ
やっぱりpaddingとoverflowを使ったやつで解決します。

　　display:hidden;

>>852
display:none;の事でしょうか？
それともvisibility:hidden;？
後者はまるごと消えてしまうのでダメとして、前者も音声ブラウザから読み上げられないらしいのでその方法は取らない様にしています。

>>853
> 前者も音声ブラウザから読み上げられないらしい

横やりなんだけど。
その情報は半分間違っていて、本来ならば@media auralでdisplay: none; であれば
読み上げ系は読まない、ってなるはずなので@media screenでdisplay:none;としても
問題はないんです。

ただ、読み上げUAで有名なIBMのHomePageReaderは、ただのスクリーンリーダーで
MSIEコンポーネントがレンダリングした結果を読んでいる＋α程度なんで、
display:none;の部分が（IBM HPRでは）読み上げられない、っつーことなんです。
ちなみにIBM HPRはVer.3で開発停止してるっぽいんだけど、MSIE7以降にまた動きが
あるやもしれません。

>>853
音声ブラウザを考慮に入れていて、なぜにそんな姑息な方法を取るんだ？

>>854
スクリーンリーダー全部が読まないと言うわけではないんですね。なるほど。

>>855
音声ブラウザ考慮はあくまでオマケ程度なので。
やれるんだったら、やっとこうぐらいの気持ちです。
一応ナビゲーションのスキップ程度はやってますけどね。

>>856
あ、いや、スクリーンリーダーは“スクリーン”を読むわけで、それで正しいんだけど。
単なるスクリーンリーダーとは違う「読み上げ系webブラウザ」に望まれるのは、
要素（タグ）を正しく理解して、かつ、スタイルシートによる演出を加えて、
音声と効果音によって正しくそれをユーザに伝える、ことで。

あー、なにスレ違いなこといっぱい書いてんだろう。
すまそすまそ。

body{
font-size: 100%;
}

上のように、font-sizeの値を親要素の文字サイズに対して%で指定しました。
bobyの親要素はhtmlですが、この文字サイズをpt、mediumなどで表すとどうなりますか。
また、font-sizeの値を指定しなかったときには、100%で表示されているのでしょうか。

質問です。
position: absolute;で位置を指定した画像を、その位置固定することは可能でしょうか｡
コンテンツを右上寄りにしていて、ブラウザのサイズを変更すると画像が移動してしまうので。

>>858
font-size: 100%; とは観覧者のブラウザの設定した値で表示される
>>859
それは position: fixed;

画像をimgタグで、テキストはalt属性にすればいいじゃん

>>858
font-size の % は親要素の計算値に対する割合になる。
具体的なサイズで示す pt や medium で置き換えられるものではない。

最上位要素のフォントサイズはブラウザ依存。(通常はユーザーの設定値)
medium の実際のフォントサイズはブラウザ依存。

特に指定しなければフォントサイズは親要素の計算値を継承する。
従って、親要素の計算値の 100% と同じ結果になるはず。
ただし、ブラウザのデフォルトスタイルシートやユーザースタイルシートで
何か値が指定されていればこの限りではない。

>>860
>>862
的確な解説、感謝します。理解が深まりました。

>>860
fixedにした所、absoluteで指定した絶対位置が適用されませんでした｡
何とか絶対位置を保持しつつ固定できれば良いのですが...

>>864
>>860の言うとおりposition:fixed;が正しい。ただし、Win+IEでは未実装。
どうしてもWin IWでも位置を固定したいなら背景に敷くくらいしかないのでは。
あとはMozilla,Operaで見て自己満足するとか。

あぁゴメン。打ち間違えた。IWってなんだろね。

>>864
position: fixed の指定は IE では正しく動作しません。
Mozilla では動作しますが、ほかの要素と重なるとちらつくので
できるだけ避けた方がいいと思います。

質問させてください。

<div id="nav"><ul></ul>・・・</div>
<div id="main"><h1></h1>・・・</div>
<div id="sub"><h2></h2>・・・</div>

floatを用いてレイアウトしたいのですが
div#nav　を左に　width:100px;
div#main　を右に　margin-left:5em;
*div#subを　width:100px;　で　div#navの直下に配置する*ことは
可能でしょうか？

ソース書き直したほうがいいですか？　うまくいきません・・・。

ちなみに
div#nav,div#main {float:left;}
です。

#subでclear:leftじゃ?

subをclear : left ;
でいいんじゃないか。

#sub { clear: left } こうだろ。

>>865 >>866
どうも有り難う御座いました｡
fixedはまだブラウザによっては様々な症状が出るみたいなので、配置を変えて対処しました｡
その内、きちんと実装されるまで待ちます...

>870,871,872
レスありがとうございます。
clear:left;　はしてみたんですが　div#main　の左下になりました。
後だしですみませんなのですが、div#main　が一番長くて
div#nav, div#sub　は短い（量が少ない）です。
div#nav　の下にdiv#sub、右に　div#main　のみとしたいのですが・・・
またレス遅くなると思うんですが、助言頂けると助かります。
よろしくおねがいします。

助けてください。list要素で画像ボタンが作りたいのですが。a要素でpadding-top
をするとボタン同士に隙間ができます。
ソースは以下です。
<ul><li><a href="***">ＨＯＭＥ</a></li><li><a href="***">ＨＯＭＥ</a></li><li><a href="***">ＨＯＭＥ</a></li></ul>
ｃｓｓです。
#nav ul{
width:150px;
list-style:none;
margin-top:0px;
}
#nav li{
text-align:center;
}
#nav a{
height:40px;
font-size:14px;
color:#cccccc;
background-image:url(img/bottun_off.gif);
background-repeat:no-repeat;
text-decoration:none;
/*padding-left:20px;
padding-top:10px;*/
display:block;
}
#nav a:hover{
background-image:url(img/bottun_on.gif);
display:block;
}
どうしたらくっつきますか？

>>874
試してないが#mainにフロートがかかってなければうまくいくんじゃないか

>>875
ひょっとしてFAQの1>>6に関わる問題か？

やはり>>875ではpositionを使うしかないっすかね？
>>6の意味がわかんないっす。

>>877
line-heightが継承されて無い？

>>877
互換モードなら#nav aのheightを50pxにしてないからかも。

>>879
互換モードてなに？
heightを50pxにしたらもっと広がった。
こりゃpositionかな？
position使うとレイアウト崩れそう。floatで組んでるんで。

>>880
文書型（最初のDOCTYPEなんたらってやつ）と使ってるブラウザは？

>>880
あと、ボタンの画像の高さはいくつ？

2段組にしたときに、短いほう（メニュー）の高さをもう一方にあわせて見せるため、
全体を包んだdivにメニューと同じ色を入れています。

#layout{width:700px; background-color:#888888;}
#menu{float:left; width: 170px; background-color:#333333;}
#main{float:right; width: 630px; background-color:#888888;}

<div id="layout">
　<div id="menu">
　　<ul>
　　　<li>あ</li>
　　　<li>い</li>
　　</ul>
　</div>
　<div id="main">
　　<p>ああああああ</p>
　　……
　　<p>ああああああ</p>
　</div>
　<br class="clear-both">
</div>
↑こんな感じです。
IE6では#layoutの背景色が#menuの下にちゃんとでるんですが、
Firefoxだと#layoutの背景は表示されません。
#menuの背景をなしにしたりtransparentにしたりしてみてもやっぱり表示されません。
#menu側の背景を一番下まで続けさせる方法はないでしょうか。

widthの値が合わないのは無視してください。
書きながら計算間違えちゃいました。
さらに#mainと#menuの背景色が逆です。

慌ててました…orz

>>883
div#layout:after{
height: 0;
clear: both;
display: block;
visibility: hidden;
content: ".";
}
多分これを付ければ良いかと。

質問です

body { width: 400px; }

NN7では効きますが、IEで効きません。IEでbodyの幅を設定する方法を教えてください。

>>881
レス遅くなってすみません〜やっと自宅に帰れた〜
ブラウザはWInIEです。
>>875のソースのように改行してないつもり。
>>882
画像の高さは40だったはず。（いまの時点では確認不可）

>>887
画像の高さが40って事は、padding-top:10px;を付けた時にはheight:30px;にしなければいけないかも…。
最初のDOCTYPE次第ですが…。

>>885
バッチリでした！
これまで3ヶ月間見てみぬフリをしてた問題解決です！

でもなんでこうなるのかよく分かってないので、もう少し考えてみます。

ひとまずありがとうございました！

>>888
やってみます！
レスが明日の１１：００ごろになると思いますが。。。
すまんm(__)m

>>876
遅くなってすみません。レスありがとうございます。
> #mainにフロートがかかってなければ
試してみましたが無理でした。

htmlのソースを
<div id="main"><h1></h1>・・・</div>
<div id="nav"><ul></ul>・・・</div>
<div id="sub"><h2></h2>・・・</div>
とすれば楽なのかもしれないんですがナビは上に置いておきたいのです・・・

cssでは無理なのでしょうか・・・？

>>886
IE6なら標準準拠モードで。それ以外は無理だったかと

>>891
幅が25%、70%とかでいいんだったら
#navi, #sub { width: 25%; float: left; }
#main { width: 70%; float: right; }
でいけるんだけど#navi、#subは100px固定でいきたいんだよね？

#mainを絶対配置にするという手もあるけど幅がな……

やった！！画像ボタンがくっつきました！heightを30にしてみました。
けど、なぜに30ｐｘ？40ｐｘにすると大幅に隙間ができるんだけど？

>>894
いや、だから>>6に書かれているように
本来heightにはpaddingは含まれないんだって。
(見かけ上height + paddingの高さがあるように見える)

とても初歩的な質問で本当にすみませんが、どうしてもわからないので
教えて下さい。

テーブル内に背景固定をしたいのですが、MacではIE、サファリともにきちんと表示されているのに
ウィンドウズIEでは固定されずにスクロールと同じく背景も動いていきます。
ウィンドウズIEでも背景固定できるようにしたいのですが、どこを弄ればいいのかさっぱりわかりません。

.table{
text-align:left;
margin:0;
background-color:#fff;
background-attachment:fixed;
background-image:url(◎.jpg);
background-repeat:no-repeat;
background-position:100% 40%;
}

として、tableタグにクラス指定しています。

本当にすみませんが、どなたか教えてください。
お願いします。

Mac IE5.XでのCSSの確認方法どうしてます？
Macを持っていないので友人のもので確認してたのですが、変更が確認できません。

→レンタルサーバーのツールでアップロードしたCSSの値を変更。
→ブラウザで確認

と言う流れで作業してたのですが、「更新」を押しても変更が反映されず。
IEのキャッシュの設定を変えてみても効果なし。
変更したCSSを再度読み込ませるにはどうしたらいいでしょうか。

>>897
環境設定でキャッシュをクリアするボタンを押す

>>897
Alt+F5

>>898
>>899
ありがとうございます。
すぐに試すことはできませんが、早速参考にしたいと思います。

>>896
これか。一応使用の範囲内だな。
ttp://cssbug.at.infoseek.co.jp/detail/winie/b065.html

font-familyの指定がマックで反映されません。
.fontclass { font-family: "平成明朝", "ＭＳ明朝" ; }
を<div class="fontclass">テキスト</div>で指定してます。
ウィンドウズでは反映されます。
マックに入っている他のどの書体でも反映されません。
ブラウザは5.1で、CSSのリファレンスサイトには
反映されると書いてあるのですが、何がいけないんでしょうか。
よろしくおねがいします。

↑
＞ブラウザは5.1
IE5.1です。

>>902
要は明朝系にしたいんでしょう？
.fontclass { font-family: serif; }

指定したいフォントがあるならserifの前に正しく書いてください。

>>902
日本語のフォント名は閲覧者の OS のロケール (地域設定) に
依存するので、英語のフォント名と併記した方がいいと思います。

日本語以外のロケールでは (あるいはソフトウェアによっては)
英語のフォント名が使用されます。

"ＭＳ" と "明朝" の間には半角スペースが入ります。
"ＭＳ 明朝" に対応する英語のフォント名は "MS Mincho" です。

マック固有のフォント名はわかりませんが、それも日本語と英語で
正確に記述してください。

>>904-905
ご丁寧にありがとうございます。
フォントの指定部分のみ別ファイルを用意してテストしてみたところ
反映されました・・・！
反映されないのは、ブログのCSSとHTMLに指定した時
だけだったようです。
同じclass内のfont-size, font-weightなどは
反映されているので記述の問題ではないと思うのです
ブログの何が邪魔しているのかまだわかりません・・・
こんな例あるでしょうか？

>906
そのblogのドキュメントタイプを確認汁

>>906
文字コードとか

>>907
HEAD内はこんな感じでDOCTYPEの指定はないようなのですが。。
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-jp">
<meta http-equiv="content-style-type" content="style/css">
<meta http-equiv="content-script-type" content="text/javascript">
<link href="<%css_link>" type="text/css" rel="stylesheet">
<link rel="alternate" type="application/rss+xml" title="RSS" href="<%url>?xml">
<title><%blog_name></title>
</head>

CSSファイルの文字コード指定して、その通りにしてんですか？
@charset "EUC-JP";

>>910
すいませんちょっと意味がわからないのですが・・・
このヘッドはデフォルト値です。
CSSも元々のものをコピペでテキストエディタに写し、それをコピペで戻して
ブラウザ上から更新しています
あと
<meta http-equiv="content-type" content="text/html; charset=euc-jp">
この行を削除しても表示は同じでした。

ひょっとしてブログのほうに聞くのが正しいかもしれませんね…

何を消してもうまくいかないので
やはりブログの掲示板で聞いてみます。
どうもありがとうございましたm(__)m

MacのIEで同じに見える文字のCSSを教えてください。

WinのIEで文字に12pxのCSSを当てているのですが
MacのIEで見ると、文章の横幅が大きくなってしまいます。
javascriptでWinとMacを振り分けてCSSを当てているんですが
同じに見えるMac用のCSSを教えてください。

※Macの12pxとWinの80%は同じでした。
　Winの12pxはMacの何に当たるのでしょうか？
よろしくお願いします。

フォントが違う以上、サイズを合わせようとしても無理

>>868
これじゃいやかい？
<html>
<head>
<style>
*{margin:0;padding:0;}
body{background:#ffffff;}
#nav{width:100px;border:solid 1px #ff0000;height:200px;}
#main{position:absolute;margin-left:5em;border:solid 1px #0000ff;top:0;width:700px;height:400px;}
#sub{width:100px;border:solid 1px #00ff00;height:200px;}
</style>
</head>
<body>
<div id="nav">nav</div>
<div id="main">とりあえず幅固定700pxにしてみた。100pxと5emが重なるのはいいのかどうか不明</div>
<div id="sub">sub</div>
</body>
</html>

>>913
MSゴシック（等幅）でletter-spacingを1pxくらいとるとだいぶ近づくけど、
全く同じにはできない。そもそもOsakaでもアンチエイリアスのON/OFFで
一文字あたりの幅がかなり違う。
そもそも文字サイズはユーザ側で適宜変更できてしまうので、文字網の量の
多少の変動は許容できるようなレイアウトをするのがいいです。

馬鹿みたいに肥大化してしまったCSSファイルから
既に使われていないclassを抽出して整理する方法は
あるでしょうか…orz

MSoffice入れてなかったら、MSゴシックなんてmacに入っとらん。
IEももうOSのインストールディスクには入ってないし。

>>918
逆。ウィンドーズでの表示の場合に、MSゴにして（Pでもいいけど）文字間1pxくらいとると、
OsakaでアンチをOFFにしたのと、そこそこ近づくよって話です。
わかりづらくてスマソ。

>>917
devasを使って全HTMLファイルのクラスを一括検索。
該当なしは削除。

>893,915
レスありがとうございます。遅くなってしまって本当にすみません。

できれば幅は％でいきたいですが　893,915　のやり方でしたい形には
だいぶ近づいてきました。
今帰宅したばかりでパッとやってみただけなのですが
これをヒントにもう少しがんばってみます。
またお手上げになったら聞きにこさせてもらうかもしれませんが・・・

本当にありがとうございました。がんばります。

>>920
やっぱそれくらいしかないんですよね…(･ω･`)
レスどもです。

クラス削除で思い出すのは、クラスはいちいちつけたほうがいいってことだな。
クラスなんてダサイ、構造依存でCSSをつけるが通だと最初は思っていたが、
手を加えるときに思わぬしわ寄せが来てたいへんだった。
気づかずに他のページがぐちゃぐちゃになったこともある。
以来、別段クラスをつける必要がなくても、
HTMLの一まとまりごとにクラスやIDを振るようにしている。

うちの父ちゃんも物を整理するときは
なんでも箱にしまって名札をつけているよ

スタイルシートからスタイルシートを呼び出すのがあったような気がするのだけど、
どうやったらいいか教えてー

>>925
@import

>>926
ありが�d

質問です。
<p style="clear:right">
<span style="float:right ; width :200px">コメント</span>
<img src="test.jpg">
</p>

画像を左に、テキストを右に配置しようとしてます。
ところが、なぜかMac　IE5,2では画像がテキストの左に配置されません。
また、なぜかテキストの行間が不規則になります。どうしたらいいでしょうか。

インラインに・・・・

(´-`).｡oO( 何処でそんなの覚えてくるんだろうなぁ・・・)

え・・・全くわかりません。
もう少しヒント下さい。

画像を左に寄せたら？

windowsのかた、IEではborder-style:dottedって表示されてます？
macのsafari,IEではきちんと表示されるのですがwindowsのIE6.0では
なぜかdashed(破線)
- - - - - - -
のように表示されます
.............
こういう点線にしたいんですが・・・


>>928
行間は<タグ style="line-height: Xpt;">テキスト</タグ>
でどうでしょう？

<タグ>
ってのはなかなか新しい書き方だな……

h1のHEIGHTをIE６とモジラであわせるのってどうやるんでしたっけ

>>933
IEだとddottedでも破線になるよ。
background-image使うのが楽チンかな。

>>935
>>6のQ1かな。

少々スレ違いですがどなたかお知恵を！
お客様の依頼で、あるテキストをCHRISTINAで表示させて
欲しいとのこと。
Windowsフォントらしく、手持ちのPC、WindowsXP、HomeEditionも
Professionalも見てみましたが入っておりませんでした。
このCHRISTINAフォント、どこかでDLできる場所はありませんでしょうか？

>>936
ありがとうでございまするううう。

>>937
そのフォントがどんなのかわからないと探しようがないけど…。
ttp://www.fonts.com/findfonts/detail.asp?pid=319995
これじゃなければ僕にはわからないっす。

スレ違いだとわかってるなら次は他でお願いしますね。
…って、フォントスレ無くなったの？

>>936
ddotted→dottedね。

>>936
親切なかたありがとうございます!

>>939
ありがとうございます。
フォントスレ、フィルタで探してみたのですが
見当たらずCSSで表示と思って書いてしまいました。

先に貼れよって感じですが、フォントは下記です。
ttp://www.sun-inet.or.jp/~seven-ss/font2/font.htm
どうも筆ぐるめとやらに入っているようなので
購入を検討してみます。

感謝でした。

902,906ですが、やはりブログの問題でなくマック×外部CSSの問題のよーなんです...
すいませんがアドバイスいただけたらと思います

【環境】MacIE5.1.7, OS 9.0.4
【やりたいこと】外部CSSからclassでfont-family指定。

【font-family指定が成功する場合】
・htmlのhead内cssに書いたclassで指定した場合
・htmlのbody＞タグ内styleで直接指定した場合
つまり、これは成功
■HTML
<div style="font-family:'平成明朝'; font-size:20px;">テキスト</div>

これは失敗
■外部CSSファイル
.test {font-family:'平成明朝'; font-size:20px;}
■HTML
<div class="test">テキスト</div>
※ただし、同じclass内のfont-sizeやその他の属性は反映される

【既にやってあること】
・HTMLは lang="ja"、charset=euc-jp
・CSSファイルの文字コードはeuc-jpに変換済み
・CSSファイルでcharset宣言（@charset "EUC-JP"; ）

こんな感じです。
なぜ反映されないんでしょう…

>>942
てゆーか平成明朝って指定したことないからわかんないけど
Macに入っていたっけ？平成明朝
入っていないなら代替指定がいるよね。

で、ヒラギノだと"ヒラギノ角ゴ Pro W3"という具合に太さ付きで指定したと思うんだけど
平成明朝も太さ指定は要らないのかな？

あ
>>942よく読んでなかったスマソ>>943無視してね

俺のpcに"平成明朝" なんて無いからどうでもいいや。

フォント指定なしでいいよ

>>942
文字コードが何であろうとlink要素でインクルードした次点でunicodeとかに
なってんじゃないの？予想だけど。
あと、デフォのOS9だったら明朝の書体って平成明朝（と細明朝体も？）くらいだよね？
だったらserifでいけそうな希ガス。

>>942
残念ながらMacIEの外部CSSは
Shift_JISかUTF-8にしないと日本語を読んでくれない。

おお・・・！

>>948
確かにShift_JIS、UTF-8にすると大丈夫でした！ローカルで。

が、肝心のブログに写したらどっちも化け化けでした・・・。
EUCのみのようで。
これで諦めがつきました。
本当にありがとうございました。

>>950
font-family:'平成明朝' , serif;

でもだめ？

>>951
euc-jpではダメっす

喪前ら全問正解してから質問汁
ttp://allabout.co.jp/computer/hpcreate/closeup/CU20050517A/index.htm?FM=rss

>>953
簡単過ぎじゃね？

>953
やってみたけど、正直言うとscriptの方に興味持っちゃった。
（ちと重いけど、flaに応用出来そう）

>>952
あらかじめ数値参照みたいな形式に置き換えておくとかは？
何だっけ、これ。BASE変換でもないし…ともかく、そんな技があったようなきがする。

>948
『日本語を読んでくれない』だけで、
@charset EUC-JP;
の外部CSSは読み込んでくれるよね？
mac持ってないから調べられない。。。

http://www.mitsue.co.jp/case/design/c_index.html
次、テンプレにこれ入れてくれないか？

お前が建てて入れたら宜しい。

じゃあそろそろ建てますよ　と
テンプレは良くわからないのでよろしく。

つttp://pc8.2ch.net/test/read.cgi/hp/1116580729/

連続投稿で規制されたが>7のヘルプで出来たぞ。

　/* CSS･スタイルシート質問スレッド【43】 */
http://pc8.2ch.net/test/read.cgi/hp/1116580729/

<html>
<head>
<title></title>
<style type="text/css">

div.logo {
width: 166px;
height: 60px;
margin: 0 auto;
border: 1px solid #000000
}

</style>
</head>

<body>

<div class="logo">
<img src="./logo.gif" width="166" height="60" border="0">
</div>

</body>
</html>

ボックスのサイズと画像のサイズを同じにしているのに何故かボーダーと画像
とが同じ大きさになりません（画像の下に隙間ができます）。
NN7.1なら隙間ができないんですが、IE6だとできちゃいます。
これもIEのバグなんですか？

<div class="logo"><img src="./logo.gif" width="166" height="60" border="0"></div>

おーっ、同じ大きさになりました。ありがとうございます。
タグの改行は表示に影響しないとばかり思っていましたが
（どこかでそう読んだ気がします）私が常識知らず
だったのでしょうか。

何しろ>>963さん、感謝します。

常識知らずでし

だな

>>957
css自体は読み込むよ
ただ日本語で指定したフォントファミリーは無視される

失礼しました。これで一歩常識人に近づきました。

だがな、常識人ってつまらんのよ。

>>957
日本語がへんなバイト列として解釈されると、日本語以降が無視されたりもする。

body > h1 と書いてある「>」というのはどういう意味なのでしょうか。
記号なのでどう検索ワードを入れていいかわからず途方に暮れてます。

>>972
子供セレクタ

>>956
横文字で指定する方法あるんですよね。
でも、指定したいフォントの横文字表記が全て調べられないので断念

つか和文フォント大辞典、便利なサイトだけど
フォント指定する時の正式名称も載せてくれたら神なのに・・・
と思った。

↑ごめん何言ってるかわかんないね。
各社フォントのサンプルが見れるサイトの話です

したら、ｱﾄﾞ書く！

>>973
ありがとうございました。たどり着けました。

>>976
大辞典じゃなくて大図鑑だった
ttp://ohkadesign.cool.ne.jp/wabunfont/category/category.html
この文字種別検索が便利。
でもfamilyは載ってない・・・
CSSに関係ないのでここらで

そろそろ次スレッドの準備。
FAQのA5（>>8）の下記はリンク切れ？
　http://kobit.info/tips/overflow.html
　http://kobit.info/files/frame.html

新スレッドへ移行したら下記で申請もよろしく。
　http://qb5.2ch.net/test/read.cgi/operate/1106260567/l50

>>979
次スレ立ってます

/* CSS･スタイルシート質問スレッド【43】 */
http://pc8.2ch.net/test/read.cgi/hp/1116580729/

　ﾂｲー　 -＝　∧_∧
　　　 -＝≡　（　・３・）　うＭＥ
　　　　　　-＝（　つ┯つ
　　　　 -＝≡/　 / //
　　　 -＝≡（_＿）/ ）
　　　　 -＝ (◎)￣））

　| _∧
　|・３・）・・・うＭＥ
　|⊂ﾉ

　　 　　　　　/つ_∧
　　/つ_,∧ 〈（ ・３・）　うＭＥ
　　|（ ・３・） ヽ ⊂ニ)
　　ヽ__と/￣￣￣/ |
　 ￣＼/＿＿＿/￣￣

ｳﾒ━━━━ヽ(＾▽＾ )ﾉ━━━━!!!

>>951
serifは、HTMLに直接書いても駄目みたいですね。macIE5.1。