CSS、スタイルシート質問用スレッド【 2 】

Cascading Style Sheetsの事で尋ねたいことがあったらこちらへどうぞ。
みなさん、煽らないでね。

[過去スレ]
　http://mentai.2ch.net/test/read.cgi?bbs=hp&key=974934062&ls=50

[関連サイト]
・CSS1の仕様書の原文(英語)
　http://www.w3.org/TR/REC-CSS1
・CSS2の仕様書の原文(英語)
　http://www.w3.org/TR/REC-CSS2/

・CSS1の仕様書の翻訳(日本語)
　http://www.y-adagio.com/public/standards/css1/toc.htm
・CSS2の仕様書の翻訳(日本語)
　http://www.y-adagio.com/public/standards/tr_css2/toc.html

・ZSPCのStyle Sheets Reference(日本語)
　http://www.zspc.com/stylesheets/index.html
・とほほのスタイルシート入門(日本語)
　http://wakusei.cplaza.ne.jp/twn/wwwcss.htm
・ばけらの CSS リファレンス(日本語)
　http://www.ne.jp/asahi/minazuki/bakera/html/css/reference

載せてるとこのツッコミいれないでね。
わかりやすいリファレンスサイト、解説サイトの情報待ってます。

ツッコミって、とほほの事か？

三日坊主＋＋の部屋
http://east.portland.ne.jp/~sigekazu/

CSS1テストスイート
http://www.doraneko.org/css1test/

あげ

ブラウザでCSSを無効、あるいは非対応のブラウザを使用している人の割合ってどのくらいなのかな？

背景とか文字色をHTMLの方で指定しないで、CSSの方だけで設定すれば、例えばリニューアルなんかの時CSSだけを変更すればいいから楽だよね。
でもこれだと、CSS有効じゃないブラウザの場合は大変なことになるから。。。

>>6
配色/背景画像を全部スタイルシートで書いとけばたいしたことにならんと思うが‥‥どうよ？

>>6
CSS を OFF にして大変なことになるようなら
HTML の方を見なおした方がいいと思う。

「CSSでmonospace指定したとき」について、
バグ存在したように記憶しているのですが、
どうもその情報が見つかりません。
自分の思いこみなのでしょうか？

Win、Macともにだいたい読みやすい行間って、いくつくらい指定すれば
いいのかな？ 平均的な値知ってる人いますか？

1.15em

170%

デザイン全体との絡みで違うとは思うけどナー。
経験則では120%が多いけど。

winのIE5.5って、例えば
body+p{****:****;}
とかした場合、（スタイルが）無視されちゃうんですけど、
5.0ってこの継承はされてような気がします…。
実際どうなんでしょうか。

>>14
IEはCSS2で拡張されたセレクタには対応してないです。

Mac版IEの一部のバージョンでは、
font-family:monospace;の指定をされた文字が1バイトと認識されてしまい、
文字化けを起こすと、複数のページ（どこかは失念）聞いたことがあるのですが、
その具体的なバージョン、どなたか、分かりませんか？
＃しかし、Namazuで、おもいっきりfont-family:monospace;を使っているんですよね。。。

>>16
http://east.portland.ne.jp/~sigekazu/css/font_family.htm

>>14
あなた、多段荒らしさんですね？

>>15
遅レスごめんなさい。やっぱ対応してませんでしたか…。有難うございました。

>>18
えッ？

age

>>19
ウフフ。分かってるんですよぉ〜(￣ー￣)ﾆﾔﾘ
その名前は多段串を表してますね〜(笑
http://proxy.proxy.proxy/-_-/http://proxy.proxy.proxy/　（ﾆﾔﾆﾔ

19はスキップアップにサイト作ってる人でしょ？

>>21
それがどうかしましたか？（ピュア）

|-_-|萌え〜
えッ？萌え〜

>>21
前も誰かに言われました…。
いや、むしろココでは「ヒッキー」と言われそうな気もしますが。

>>22
どっちかというと「お尻」の方ですけど、ここではフツーの人なので
よろしくお願いします。おれも答えられる質問があったらできるだけ
回答したいと思います。はい。

>>24
何故。笑

さげとくね。

idとclassの違いって何でしょう？
というかidの存在意義は？
idは一つしか使えずclassはいくつでも使える、としか認識してないんですがどうなんですか？

>>25
やばい・・・l-_-lたんﾊｧﾊｧしてたらホントにヌケちゃった。
鬱だ。。。俺って一体・・・

idってCSSのためだけにあるんじゃないから、
CSSスレで存在意義語っても…

generic-famiry:sans-serif;
font-family:Verdana;
font-size:12px;

この指定なんですが、フォントが崩れて表示されてしまうマシンがあるんです。
px指定が問題なのでしょうか？それとも他になにか原因ありますか？
環境はwin限定でもちろんverdanaフォントはインストールされています。
px指定くらいしか原因が思い当たらないのですが、pt指定に比べて崩れやすいといったことが
あるのでしょうか？

よくわからんけどわかりました

IEのfilter:について聞きたいのですがここで良いでしょうか？

今回IE限定のページを作るのでfilter:機能を使いたいのですが、
なぜか同じWin98＆IE5.5という環境にも関わらずfilter機能が
働かないマシンがあります（vaio）
やろうとしていることは、
<IMG SRC="xxx1.jpg" ID="PHOTO" STYLE="filter:blendTrans(duration=1);">
このイメージに対して
　PHOTO.filters.blendTrans.Apply();
　PHOTO.src='xxx2.jpg';
　PHOTO.filters.blendTrans.Play();
これでイメージ置き換えの際にトランジッション効果をかけたいのです。

この際に、先のvaioだと効果が働かないだけでなく、イメージの切り替え
そのものも無効になってしまいます。
そこで、filterに対応しているかどうかを判定して対応している場合のみ
先の処理をさせて、未対応の場合は単に PHOTO.src='xxx2.jpg'; だけを
処理させようと思ったのですが、filterに対応しているかどうかの判定方法が
分かりません。if(document.images)のようにif(filters.blendTrans)などとやっても
エラーになってしまいます。何か良い方法は無いでしょうか？

A{
text-decoration : none;
}
TD{
line-height : 150%;
}

こういうCSSをリンクで挿入しました。でも、何故かNNではちゃんと反映するのに
IE5.5じゃ反映しないのです。
HPビルダーを使って作成したんですが、何度やり直しても反映してくれません（泣）
IEそのものがおかしいのでしょうか？

>>32
htmlファイルのhead内に埋め込んでもダメですか?

>>31
そこまでいくとスクリプトの領分だろう。
JavaScriptスレで聞いてみたら？

HTMLのテーブルタグでデザインしてはいけないみたいなので、
border-style:solid;で文章を囲みました。
この四角を右に持っていくときは、
text-align:right
ではできません。
どうすればいいでしょうか？

インライン要素・置き換え要素なら親要素でtext-align:right。

聞きたい事アルよ。
例えば、スタイルシートで、
（以下)

――――――――――――――――――――
Ｈｏｇｅｐａｇｅ　Ｔｉｔｌｅ
――――――――――――――――――――
hogehogehogehogehogehogehogehogehoge
hogehogehogehogehogehogehogehogehoge
hogehogehogehogehogehogehogehogehoge
hogehogehogehogehogehogehogehogehoge
hogehogehogehogehogehogehogehogehoge
――――――――――――――――――――
Ｈｏｇｅｐａｇｅ　Ｔｉｔｌｅ
――――――――――――――――――――

(以上)
ちなみにhogehogehogehoge...は内容です。
こういう感じで書くと、内容が長くなると、
下の「Ｈｏｇｅｐａｇｅ　Ｔｉｔｌｅ」が下に潜ってしまいます。
ウィンドウの縦サイズがどうでも、
常に下のラインをウィンドウの最下部に出していたいんです。
映画にある上と下の黒い部分って言えばわかるかな？
フレームなら、下のラインをフレームにすれば、
常に出したまま、内容だけをスクロール出来ますが、
これをフレームを使わずやりたいんです。
そういう都合の良いスタイルシート教えて下さい。

>>35
margin-right:0;margin-left:適当な数値;

>>37
position:fixed;bottom:0; （ただしNetscape6・MacIE5以上。WinIE非対応）

>>38
WinIEでもＯＫっていう、都合の良いスタイルシート下さい・

abbrの付け方教えてください。
<th abbr="">ですか？
titleっていうのはなんですか？

>>39
CSSだけだと不可能。JavaScriptと組み合わせれば、不可能でもないが。

>>40
abbrの中身は見出しセルの省略形。
例えば
<th>18日の閲覧者</th>
という見出しセルがあるなら、
<th abbr="18日">18日の閲覧者</th>
のように使う。
title属性は、その要素に注釈を付けるのに使う。

PGP公開鍵を載せるんだけど、

white-space: pre を
使うべきか、
br
かどちらがいいでしょうか？
brでttしたらいいでしょうか？

>>41
分かりやすい説明をありがとう。
すごく助かったよ。

>>42
PGP公開鍵は別ファイルというか.ascそのままにした方がいいかもな。
fingerprintをaddressに入れておくのはありかもしれん。

あくまでHTMLに含めたいのならば、white-space: preだろうな。
ソースからでもコピペしやすいほうがいいだろう。

>>42
PGP使ったことないから知らないが、改行に特別な意味がある（どーしても改行しなきゃいかん）なら white-space:pre 、<pre>、<br> の順におすすめしとこう（個人的嗜好）。
改行に特に意味がないなら、選択肢に「整形しない」を加えるところだけど。

>>43
そりゃどうも。

>>37
これで出来るかも。当然ながらoverflow対応ブラウザのみ。
うちはMacなんでWinIEでは未確認。

<HTML>
<HEAD>
<TITLE>ＴＥＳＴ</TITLE>
<STYLE TYPE="text/css">
&lt;!--
BODY{margin:0;padding:0;overflow:visible;}
.header{position:absolute;top:0;left:0;width:100%;background-color:#CCCCFF;}
.footer{position:absolute;top:90%;left:0;width:100%;background-color:#CCCCFF;}
.main{position:absolute;top:50px;left:0;width:100%;height:80%;overflow:auto;}
　--&gt;
　</STYLE>
</HEAD>
<BODY>
<DIV CLASS="header">
Ｈｏｇｅｐａｇｅ　Ｔｉｔｌｅ
</DIV>
<DIV CLASS="main">
hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>
hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>
hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>hoge<BR>
</DIV>
<DIV CLASS="footer">
Ｈｏｇｅｐａｇｅ　Ｔｉｔｌｅ
</DIV>
</BODY>
</HTML>

>>46
WinIEでも5.0以上ならいける。

>>46
おお！素晴らしい！
NN4でも実現されないけど、表示には問題無いし、使ってみます。
ありがとう。

IEのfilter:についてなのですが、CSSスレで聞いたらJavaScriptスレに行くよう
言われたのでこちらで質問させてください。

今回IE限定のページを作るのでfilter:機能を使いたいのですが、
なぜか同じWin98＆IE5.5という環境にも関わらずfilter機能が
働かないマシンがあります（vaio）
やろうとしていることは、
<IMG SRC="xxx1.jpg" ID="PHOTO" STYLE="filter:blendTrans(duration=1);">
このイメージに対して
　PHOTO.filters.blendTrans.Apply();
　PHOTO.src='xxx2.jpg';
　PHOTO.filters.blendTrans.Play();
これでイメージ置き換えの際にトランジッション効果をかけたいのです。

この際に、先のvaioだと効果が働かないだけでなく、イメージの切り替え
そのものも無効になってしまいます。
そこで、filterに対応しているかどうかを判定して対応している場合のみ
先の処理をさせて、未対応の場合は単に PHOTO.src='xxx2.jpg'; だけを
処理させようと思ったのですが、filterに対応しているかどうかの判定方法が
分かりません。if(document.images)のようにif(filters.blendTrans)などとやっても
エラーになってしまいます。何か良い方法は無いでしょうか？

↑すみません間違えました(;´Д`)

white-space: pre
使ったんだけど、右端がそろわないの。
なぜだろう。

>50
(;´Д`) ←かなり苦しそうですね（ＭＳ Ｐゴシック）。

HTML4.01 Strictで掲示板が吐き出すHTML書いてるんだけど、
<form>のなかに<br>とか、<tr>とかつかっては行けないのですか？

>>53
直接<br>や<tr>を書いてはいけない。
<form>内に書くのなら、<p>や<div>で囲もう。

>>53
ん！？ ところでそれはCSS質問スレに書くことなのか？

>>51
white-space: pre だけじゃ等幅フォントにはならないからね。

>>49
IE の設定の「ページの切り替えを使う」ってのがオフになってないかな。
英語だと Enable Page Transitions なんだけど、訳しかたがヘンだから
わかりにくい。

すいません。質問させて下さい。

HTML4.01 Strictで
<A>や<BASE>のtarget属性って使えませんよね。
とすると、それもＣＳＳで指定することになるのでしょうか？
なかなか分からなくて。あぅあぅ。

>>58
CSS はあくまで見栄えを指定するものです。
おとなしく Transitional を使いましょう。

ああっなるほど。大人しく使います。

ありがとうございました〜♪

CSSでの数値の指定ってなにがいいとかあります？(pxとかemとか)
マージンとかに使う単位と、文字のサイズに使う単位で最も適したの知りたいです。

>>61
だいたいemと%がいいんじゃないの？
ボックス要素にemでwidth指定すれば、閲覧者の方で文字サイズを変えてもデザインは大体保持される。
ただし、emで指定した要素がウィンドウのサイズに対して大きすぎると見づらくなるので、そのときは
emでなく、ウィンドウ幅に対する%を使えばウィンドウの大きさを変えられても見た目がほぼ保たれる。
文字のサイズにはpx、pt、などを使うと固定されてしまうので90%とか普通にsmall、x-small等を使う。
自分ではこんな感じです。

画像とのバランスが問題になるところだけ、pxを使っています。

FORMとOPTIONタグで作るドロップダウンメニューの中身を
右揃えにする方法はありませんか？
たぶんCSSでできるんじゃないかと思ってるんですが。

場違いな質問ですけど、aspとか使わないんでDW4より
使いやすいGoLive5使ってますけど、ちょっとソースとか書いてると
表示が崩れませんか？
<table><tr><>・・・・・・
<table><tr><>・・・・・・
<table><tr><>・・・・・・
てな感じで・・。

>>65
場違いだとわかってるなら質問するな。

<Style Type="text/css">
&lt;!--
body{ background : #ff0000 url(dokyun.jpg) no-repeat position-Y=500;}
backgroundAttachment='fixed'
--&gt;
</Style>

僕にはこんな感じでしか画像をＹ軸に移動させる方法を思いつきません。
もちろん移動なんかしてくれません。
誰かこのドキュソタグに救済を！
また、この背景画像をスクロールしないように固定したいのですが
どの辺にどの様に
background-attachment
を組みこむのか教えてくれませんか？

free live stream
http://216.110.42.28/feeds/?typ=random

背景の固定例

BODY {
background: white url(hoge.gif);
background-attachment: fixed
}

>>68
ありがとうございます！
ところで僕の>>67のやり方ではなぜ画像が移動できないのでしょうか？
position-Y：500
こんな感じでもやってみたのですが。
もう疲れてきました。　鬱氏

>>69
一括指定に『position-Y：500』などは存在しないからじゃないでしょうか。
Y軸から500px(ピクセルかどうか知らないけど)、X軸から0の場所の一括指定なら
body
{background:#ff0000 url(dokyun.jpg) no-repeat 500px 0 fixed;}
とかでいいんじゃないかな、と。

>>70
ありがとうございました！
僕がとってもバカなことで２日間も無駄にしていたことに気が付きました。
早速使わせて貰います。
また、僕も一応解決していたと思っていた方法も参考に残しておきます。
body
{background:#ff0000 url(dokyun.jpg) no-repeat 50%90%;
background-attachment: fixed}
でもこれだと環境によって誤差が出ると思われるのであくまでも参考です。

ｶﾞｶﾞｶﾞｶﾞ！鬱氏
body
{background:#ff0000 url(dokyun.jpg) no-repeat 50%90% fixed;}
％で画像を調節。

>>70-71
500pxでも50%でも利用者の環境に依存するのは同じだと思いますが？
本文の方も背景画にあわせて%で指定すれば、背景を%で配置してもずれないし。
「このHPは画面サイズ1024*768に最適化されています」というのなら
pxが完璧かもしれませんが。

洩れの質問に答えられる人はおりませんか？
style="text-align: right"にしても相変わらず左揃えです。

>>74
option要素にソレを適用してもダメだったんなら
ブラウザがプルダウンメニューのスタイルシートを実装しきってないものと思われ。

>>74
スタイルシートでは無理なのでは…。

>>74
もっと想像力はたらかせて色々試せよ。

>>74
ユーザビリティ的に最悪だと思うが。。。？

最悪と言うほどヒドいかね？

>>78
洩れ的にも嫌なんだけど、出来るかどうか聞かれたので。
無理だったら「じゃあ、いいや」で済む程度の問題っぽい。

あーごめん言い過ぎたかもしれないけどさ、
リスト（項目羅列）として表記するものを、横書きでかつ右寄せというのは、
あまりにも例がないから、ユーザはとまどうかな、って。
あーでもリストとは限らないか。

デフォルト（本文、といったほうが正しいかな？）のテキストを
point指定したいのですが、
諸事情によりJavaScript不可能なため、
MacとWinでfont-sizeをふりわけることができません。
この場合、何ポイントが妥当だと思います？
10ptかな、とも思うのですが、うーむ。
他のサイトで、そういう例（UAで分けずにfont-sizeをpoint指定）が
あればいいのだが。。。

10ptなんて小さすぎて読む気がしません

ちなみに右寄せにできるか聞いてきたのはアメリカ人。

>>82
ﾏｸあんまりいじったことないのだけど、窓とﾏｸでptの表示がそんなに違うの？
10ptが小さすぎるのには同意

<COL class="*">の記述で罫線の指定はできないのでしょうか？
外部からcssファイルを読み込ませていて、
そのファイルには
col.* { border-bottom: 1 solid #****** }と打ちました。

>>74
select{text-align:right;}
でも
option{text-align:right;}
でも、Mozilla(0.8.1)で試したらフツーに右寄せ表示したよ。
Netscape6では未確認。

>>85
ポイント数の計算に使うディスプレイの解像度が、96dpiと72dpiで違うらしい。
WinとMacでどっちがどっちだったか忘れたけど……

>>86
IE5では、文字サイズの指定は効いてるけど。borderは試してないので不明。
Mozillaはcol要素のスタイル指定に対応してないみたい……

>>87
> select{text-align:right;}
> option{text-align:right;}

Netscape6だとダメっぽかったよ。

>>89
うちのNetscape6ではOKだけど。

>スタイルシートでは無理なのでは…。

んな発言してごめんなさい…。

>>90
もう一度確認してみたけど、OKだったね。スマソ。
option要素に適用すると該当する物だけテキスト寄せされて
選択項目表示のテキスト寄せはデフォのままになるのね。
select要素に適用すれば子の項目も選択項目表示も
すべてテキスト寄せされるから、使うならこっちのが便利か。

>>73
理解しました。
ありがとうございます。
>>74
>>70の方法でもどうにかなるのでは？

>>93
74？
74のはブラウザ(IE)が未対応ってことで終わってるんじゃないの？
70ってbackgroundの一括指定だし・・・。

>>87
手元にあるのはWindows版IE 5.5とNetscape 4.73なんだけど、
どっちもダメ。もしかして対応してるのってNetscape6だけ？

>>95
そゆこと。

えーと初心者な質問ですいません。
フォントサイズをCSSで12pxに指定しています。
自分は窓・IE5.5で確認してますがMacの方はどーなんでしょう？
小さいですか？
ゴマ字になるようだったらデフォルトに戻そうと思うのですが
林檎で確認できる環境にいないので、アドバイスお願いします

>>97
12pxじゃ窓環境でも小さいです。
もしかして12ptでしょうか？

>>98
いえ、12pxです。
レイアウトの都合もあって「小」と同じにしたかったんですけど小さい
んですね･･･。
デフォルトに戻しておきます。

>>97-99
font-sizeは90%とかlargeとかの指定の仕方を勧めます。
そうすれば、閲覧者が大きい、または小さいと感じてもブラウザの設定で多少融通が利きます。
「小」と同じ大きさならsmallでいいんじゃないでしょうか？

ごめんなさい。
そんな単純じゃなかったようです。
よく知らないのに口出しして済みません。

>>97
px 指定っつーことは OS に関係なく
モニタの解像度に依存するってことだ。

12pxの字なぞ、俺なら読まずに帰るな

>>74
遅レスだが‥‥
IEの<SELECT>はWin APIで描画されてる模様(ほかのフォームはIE独自で描画)
z-indexとかも全く効かん(泣)＜常に最前面表示

よって絶対無理に思われ

>>104
背景色は変えられるんだけどねー。
中途半端でイヤン。

CSS関連かどうかは自信ないんだけど
テーブルの背景色などに透過処理を施すのってどうやるの？
前にそういうサイト見つけたんだけど既にお亡くなりらしく、、、

スレ違いだったらスマソ

>>106
table{background:transparent}
つか何も指定しなきゃいいと思う。

IEのフィルタ効果かチェック模様状の透過GIFを使った背景じゃないの？

>>103
オウケイー
じゃ、指定はずすわ。

一部のブラウザでは、
日本語にmonospace指定すると文字化けするってうわさを聞いたのですが、
ホントですか？

「ユーザが自由に文字の大きさを指定できない」以外に、px指定のデメリットってありますか？
画像でつくった文字は固定ピクセルな訳だから、pxのサイズを適切に設定すれば、
かまわないような気がするんだけど。（もちろん最初にいったデメリットを無視するとだけど）

>>111
君のような脳たりんに言っても分からないだろうから好きにしたら？

px指定ではなく、画像で作った文字にはデメリットは感じないのか？

>>110
ttp://www.remus.dti.ne.jp/~takahisa/flm/css/CSSTest.html
Mac版NN4.7では文字化けするようです

>>111
「ユーザが自由に文字の大きさを指定できない」ほかには思いつきません。
しかし
＞pxのサイズを適切に設定すれば
この適切というのは一人一人違う。
万人に適切なサイズなど存在しない。
というわけで、唯一ではあるけれど大きな欠点である
「ユーザが自由に文字の大きさを指定できない」のを気にしないのなら
フォントをpxで絶対指定してもかまわないと思います。

ｱｳ、言い方が拙かった。
透過処理って言うよりは半透明処理って言った方が良いかも。

黒背景画像に半透明の白テーブル、さらに黒文字みたいな感じ。

>>114
「ユーザが自由に画像の大きさを指定できない」
から、それと対比して、フォントのpx指定にはそれなりの合理性がありますね。
とはいえ、私は無指定ですけど。
画像の大きさをemで指定すると、全体がユーザ指定のフォントサイズとの相対値
で決まるので、なかなかおもしろいんだけど、画質が荒れますね。
将来的には、ページのレイアウトは、文字の大きさに対する相対値ではなく、
アクロバットリーダのように、ブラウザにより全体を変えられるようになる
だろうと、私は予想しています。

ちょっと話題逸れるかもしれないが、文字を画像化しないことで
読む為の代替手段は大幅に増えると思う。
1ptの文字でもメモ帳とかにコピペすれば読めるように。
…ん？関係無いかな？

新ハンドルです

>>118
l-_=ld ＜バッチリっす!!

>>114
おお、このページいいですね。thanxです。
ところで、NamazuってCSSの中でmonospace使ってますよね。
このこと、Namazu開発者は知ってるのかな？

>>115
テーブルの背景がグレーとちゃうの？

>>116
んなこたぁない

>>122
どの点が?

white-spaceプロパティって、IE(少なくともWin 5.0 5.5)対応してませんよね。
インライン表示PREをやりたいんですけど、
PRE に display:inline;つけてやるしかないんでしょうか？

何が問題って、クリップボードにコピーしたときに、
最後に改行ついちゃうんですよね。

nobrじゃ嫌ですか?

inlineならPREの意味がないような気がする。

>>125 HTMLでですか？改行はしてもいいんですけど・・

>>126 やりたいのは、
<ol style="list-style:decimal; white-space:pre;">
<li>/* CSS サンプル */
<li>BODY {
<li>　　background-color : #cccccc;
<li>　　color : #000000;
<li>}
みたいな感じで、行番号をつけたソースを表したいのです。一つ一つのliの要素に
display:inline;のpreを入れてもいいんですが、124で書いた問題があるんです。
ちなみに、olのこのような使い方は、「ソースは行のリスト」
という考え方で、問題ないと思ってます。

あ、</ol>書き忘れた。つっこまないでね。

li を white-space:pre にしてもダメ?

>>121
ホントだって。半透明処理。下の画像が透けて見えてたもの、、、
（スクロールさせてみると半透明にしてる画像って訳じゃ無かったし）

そのサイトはもう無いんだけどチラっとソース覗いたときは、
alphachannel（ｱﾙﾌｧﾁｬﾝﾈﾙ）がどうたらって書いてあった。
畜生、ソース保存しておけば良かった、、、

>>130
filter:alpha(opacity=[0-100])だと思うぞ。
追記。Mozillaの場合-moz-opacity:[0-1](小数点使用可能)だ。

>>131
マジ有難う。
<table filter:alpha(opacity=[50])>
みたいな感じで組み込んで動かせばいいのかなぁ、、、？

>>129
ダメなんですよねぇ。
http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/whitespace.asp
みると、nowrap は対応してるけど、preは対応していない。
なぜじゃ！

>>132
とほほくらい見ろ
http://wakusei.cplaza.ne.jp/twn/wwwcssf.htm#Image

Java,javascript を一切使わずに音を鳴らせますか？

いま妄想してるのはこんな感じです。

a hover {
makesound: url="mokyu.mp3"
}

>>133
そういうことか…。
なら、あきらめて ＆nbsp; 使うとか。

>>135

a {
cue-before:url('mokyu.mp3'); /* クリックする前に鳴る */
cue-after:url('mokyu.mp3'); /* クリックした後に鳴る */
}

音声スタイルシートに対応したブラウザって今あるのかな。
素朴な疑問。

>>138
対応したブラウザがあるかどうかは問題ではないよ。
重要なのは仕様書があるかどうかだよ。

>>137
ありがとうございます。
ここまでいくと、さすがに「とほほ」には載ってませんね。

>>138
http://www.argv.org/~watanabe/data/SP_bepWinPaper.html
Emacspeakはbufferのmodeに応じた最適なAUIを Emacs Lispで実装しており、calendar-modeではカレンダーに適した機能を供給でき、 W3-modeではCSS2 (Cascading Style Sheets, level 2) の音声スタイルシートに対応したWebブラウザとなる。

あげ

予言しよう。
音声ブラウザが流行りだしたら、エロ小説サイトのアクセスが異常にあがりだし、
また、自分で小説を書く輩も増殖するであろう。

間違い無くな…。

ハナシかわるけどさ、モジラ対応の半透明のスタイルがあるというウワサを聞いたんですけど、御存じですか？

>>143
↓のページの -moz-opacity ってヤツじゃないかな。
www.cc-net.or.jp/~piro/tips/page/p0032.html

電子音声でヌケるのか。
さすがは電波。

ウフウン　アハアン　ソコオ　ソコオ
キモチイイ　モットツイテエ

>>144
うわ！あんがとっ

　　　　　＼__／ 　　　　／￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　　|￣￣　＝ ￣＼　＜　ボクは画質には自信があるんだ！！
　　|　 ||￣￣￣￣|| 　　＼　　映画鑑賞に最適だよ
　　|　 ||　 ´∀｀ 　||＿_　　＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　|　 ||＿＿＿＿||　　＼
　　＼　　 Mony　｜　　　＼＿＿＿＿
　　 　￣|￣|￣|￣ 　 　 　／＿＿＿／| ←ﾋﾞﾃﾞｵﾃﾞｯｷ
　　　　 （＿_）＿） 　　　　| ：=== □|／
　　　　　　　　　　　　　　 ￣￣￣￣
.
　　　　　　　∧ ∧
　　　　　　　( 　　)
　　　　　　　/ 　 |つ口 ←［北田聡］
　　　　　〜(＿__ﾉ
　　　　　＿＿∧＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　　 　 | そうか、なら早速このＡＶ再生してくれ

---------------------------------------------------


　　　　　＼__／
　　|￣￣　＝ ￣＼　　　　／￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　　|　 ||￣￣￣￣|| 　　＜　ロリータＡＶですか・・・まあいいや
　　|　 ||　；´∀｀ . ||＿_　　＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　|　 ||＿＿＿＿||　　＼
　　＼　　 Mony　｜　　　＼＿＿＿＿
　　 　￣|￣|￣|￣ 　 　 　／＿＿＿／|
　　　　 （＿_）＿） 　　　　| ：=== □|／
　　　　　　　　　　　　　　 ￣￣￣￣
.
　　　　　　　　　　ｻｯｻﾄｻｲｾｲｼﾛﾔ
　　　　　　　∧ ∧　　／￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　　　　　　　(# 　 )　＜　俺の趣味に文句あんのかｺﾞﾙｧ(ﾟДﾟ )
　　　　　　　/ 　 |　　 ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　　　　〜(＿__ﾉ

---------------------------------------------------------


　　　　　＼__／
　　|￣￣　＝ ￣＼　　　　／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　　|　 ||￣￣￣￣|| 　　＜　あ、あん、お兄ちゃん。ワタシもうイっちゃう〜
　　|　 ||. *´∀｀* .||＿_　　＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　|　 ||＿＿＿＿||　　＼
　　＼　　 Mony　｜　　　＼＿＿＿＿　再生中
　　 　￣|￣|￣|￣ 　 　 　／＿＿＿／|
　　　　 （＿_）＿） 　　　　| ：=== □|／
　　　　　　　　　　　　　　 ￣￣￣￣
.
　　　　　　　　　　ﾅｴﾙｿﾞ…
　　　　　　　∧ ∧　　／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　　　　　　　(； 　 )　＜　確かに画質はいいけど声はオマエかよ
　　　　　　　/ 　 |　　 ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　　　　〜(＿__ﾉ

リンク部分にポインタを当てたら、
その部分のテキストが太字になるようにするには
どうやればいいんでしょう？

＞149
念じる

>>149
a:hover {
font-weight: bold;
}
つーかさ、過去ログ調べなよ。
同じような質問今までに沢山でてるよ。

>>151
すみません。
上下線を出したりするのは見つけたんですが…
ありがとうございました。

>>152
ここの解説はわかりやすくてよいかもよ．
ttp://www.tg.rim.or.jp/~hexane/ach/

　　　　∧ ∧ 　 ／￣￣￣￣￣￣￣
　　 　（ ,,ﾟДﾟ）＜　質問する前に１のリンク先を
　　　　|つ つ　|　読んで勉強しろ　ｺﾞﾙｧ(ﾟДﾟ)
　　　　| 　 |　　＼＿＿＿＿＿＿＿
　　 〜| 　 |
　　 　 ∪∪

立ちギコage

ていうか、ボールドにした瞬間に文字が動くでしょ？
あれはちょっと・・・なんというか。

酔うよね

やっぱりhoverは色変更・下線表示くらいにしておかないと。

むしろfont-sizeを変えないと
a:hover { font-size: larger; }

むしろ消さないと
a:hover { display:none; }

むしろ脱がないと
body:stlip{B:95 W:45 H:75;}

>>160
動くのが嫌なんだから
a:hover { visibility: hidden; }

動かないと太るからﾀﾞｲｴｯﾄしないと
<SCRIPT LANGUAGE="JavaScript">
　　your.style.body.weight = your.style.body.weight - 20kg;
</SCRIPT>

<style type="text/css">
legend:after { content: "(" attr(accesskey) ")"; }
</style>
<form>
<fieldset>
<legend accesskey="F">投稿フォーム</legend>
</fieldset>
</form>

のように書いたとき、NN6で表示すると

投稿フォーム(F)
(F)

のように表示されるのですが、これはブラウザのバグですか？

縦書きのスタイルシート教えてくらさい！

>>165
ここでも読め。
http://www.doraneko.org/misc/i18n-format/WD990127.html
UA の対応状況は知らん。

>>166
多謝。

すんまそん。私にも教えて欲しい事があるので御教授ください。

1:<div style="width:100% ; height:100% ; ">
2:<div style="width:100% ; height:150px ; background-color:#FFAAAA ; ">テスト文字</div>
3:<div style="margin:0px ; padding:0px ; width:150px ; height:100% ; background-color:#AAAAAA ; float:left ; ">テスト文字テスト文字</div>
4:<div style="margin:0px ; padding:0px ; width:100% ; background-color:#AAAAFF ; ">テスト文字テスト文字</div>
5:</div>

てな、スタイル指定で、1行目で縦横を100％指定にしている状態で、2行目に縦をpx指定した場合に、
3行目のブロックのの縦の長さをブラウザ一杯に指定したいのですが、どう記述すればいいのでしょうか？

横幅の場合、floatで並べると、150px（3行目）+100%（4行目）で、うまくいったのですが縦ではうまくいきません。（IE5&NS6）

うーん、うまく説明できないですけど、px指定+％指定でブラウザ一杯の表示をおこないたいんです。

よくよく考えると親ブロックに対する％指定なので横幅の指定がうまくいくこともおかしいような気がするのですが…

誰かわかる方いらっしゃいます？

補足です。

縦に対する％指定はNS6では利いてませんでした・・・・・

>>168-169
テーブルでなら"*"を使えばうまくいくような気がするけど。

>そうすれば、閲覧者が大きい、または小さいと感じてもブラウザの設定で多少融通が利きます。

それをさせたくないからこそpx指定使うけどな、俺は。
見る側で勝手にサイズ変えるんじゃねーっていつも思ってたからCSS様々だよ。

>>171
糞サイトのマスター発見。
webの利点を理解してないバカがまだいたとは・・・

>>171
印刷物でも出してろ

>>171
最悪の知恵遅れだな、こんな奴がまだいると思うと（鬱

webの利点ってサイズ変えられることだけじゃないだろ
そもそも「webだからサイズ可変に対応すべき」なんていう考え方そのものが間違ってる
CSSが生まれた背景考えてみろよﾊｹﾞ

172=173=174
まぁ言いたいことは分かるよ。
そんなに怒るな。

>>175
ネタ？
CSSが生まれた背景わかって言ってる？
webの利点は文字の大きさに限らず、
ユーザーが形を選んだり出来る事だよ？
フォントサイズを絶対値で指定するのは、
ウェブマスターの意識を表してるんだよな。
ここまで頭悪そうだとネタとしか思えないんだけど。

>>177
http://www.zspc.com/documents/wcag10/index.html

http://www.zspc.com/documents/wcag10/index.html
6. ウェブコンテンツ・アクセシビリティ・ガイドライン
1. 聞くための内容や見るための内容には、同等の役割を果たす代わりのものを提供する
2. 色だけに依存しない
3. 正しくタグ付けし、適切にスタイルシートを使う
4. 自然言語の取り扱い方に関する情報を明確に示す
5. うまく変換されるテーブルを作る
6. 新しい技術を利用したページは、うまく変換されるようにしておく
7. 時間によって変化する内容については、ユーザーが制御できるようにする
8. ページ中に組み込まれたもののユーザーインターフェイスは、それ自体がアクセシブルなものにする
9. 装置に依存しないように設計する
10. 暫定的な解決策をとる
11. W3Cのテクノロジーとガイドラインを使用する
12. 前後関係や位置を表す情報を提供する
13. はっきりとわかるナビゲーションのための仕組を提供する
14. 文書は明瞭で簡潔なものにする
　　　　　　　　　　　　　　↑こんなことまで言われたかねーよ

>>179
無意味に長い引用は避けろってことなのでは？

>>179
14ﾜﾗﾀ

> CSSが生まれた背景考えてみろよﾊｹﾞ
ようするに「オレのサイト見るときゃスタイルシート切れやｺﾞﾙｧ」っていいたいんだな。175は。

ユーザスタイルシートを普及させよう!!

171＝175の暴言読んだら、激しくムカついてきた。
CSS3では、絶対値指定をユーザ・スタイルシート以外では禁止して欲しい。
マジで。

>>184
こういう指定は無視、って記述が欲しいよね。
text-decoration: none ! ignore; みたいなの。

つくづく CSS を OFF に出来ない IE ってクソ UA だと思う。

CSSを ON にできない NN も糞だけどな

ガタガタ言うならHTMLもoffにしとけば？

>>188
とっくにしとるわﾎﾞｹェ

http://www.kohshi.org/ieex/
スタイルシート無効にできる

age

>>190
あ、こりゃ便利だ。

>>171さんのサイト教えてもらえませんか？
offにするので

レジストリをいじる方法もあるよ。

鳩丸ご意見番 - Microsoft Internet Explorer 5 でスタイルシートを無効にする方法
http://www.ne.jp/asahi/minazuki/bakera/html/opinion/disablecss

Webdingsなどの絵文字フォントをアクセントとして使ったときに、
インストールされてない環境では変な記号だけが出てしまうので、
WebdingsがインストールされてなければDisplay:none;のような
状況にする事はCSSでfont-familyかなんかで出来ませんか？
教えてきゅださい。

そもそもCSSを無効にしたいような後ろ向きな人がなんでこのスレ見てんだろうか

>>195
http://mentai.2ch.net/test/read.cgi?bbs=hp&key=985279007&st=196&to=202&nofirst=true
と全然人格違うね。

>>196
マズは敵を知れと言うだろう。

>>190
これってスタイルシートも切れるけど画像もなくなっちゃうのよね。
おしい。

>>199
所詮 HTML ファイルなんだし、カスタマイズすればいいんとちゃう?

Lynxやw3mを使うというのは反則ぢゃないよね

>>179
「氏ね」とか「逝ってよし！」とかを使ってはいけないと
いうことなんですよね^^;。文章読み上げブラウザとかで
結構混乱ありますし。

w3mは現代のナチス

文字サイズの固定に目くじら立てる人って、画像の縦横もem相対で
指定しているんですか?

>>200
意味がわかりません。人のサイトをカスタマイズ？

>>203
それちょっと知りたいね。煽りとかではなく。
どうなんですか？＞文字サイズを相対指定してる方

>>204
ieex の挙動をカスタマイズってこと。
\windows\web にインストールされた HTML ファイルだから。
エディタで開けば何やってるか解ると思うよ。

>>203
pxも相対値だーぜ

>>206
文字の相対値と言う意味で考えてね。

＞206
ヘリクツこねんなよクソが

>>203
オレはテキストは em 指定だけど、
画像は通常 img 要素の width/height 属性で指定してるから
結果的に px 指定。
テキストとの相対サイズが問題になる場合なら em でやるけどね。

逆に、文字サイズを pt で固定するときに
画像サイズも pt で固定するだろうかと思ったりする。

>>209
そういうあなたは「文字サイズの固定に目くじら立てる人」ですか?

＞209
は？　画像も可変なのか？
画像が固定サイズだからこそバランスを考えて文字も固定にしたいんだよ

画像の場合、縦横比を指定できないんだからpx単位でもしょうがないでしょ。
画像を細長くされると分かりにくくなって困るし。

＞212

はぁ？何言ってるんですか？
画像っていうのは使いたいサイズ・使いたい縦横比にトリミングして使うものですよ？
そもそもなんでHTML上で縦横比を指定する必要があるの？
まさか素材集とかの画像をそのまんま使ったりしてるのか？デザインやったことある？

それから「しょうがない」って何よ？
じゃああなたは画像をどう指定してどう表示させたいわけ？（ちなみにWIDTHもHEIGHTも％指定すれば縦横比指定できるけどな。特別な場合以外使わないだろ普通）

画像は100%にすれъ( ﾟｰ^)

>>213
だから、トリミングして200*100pxの画像を75*300pxで見られたらどうする？
っていう話でしょ。

＞215
「画像を細長くされると分かりにくくなって困るし。」←この部分はそう言ってるかも知れないが
「縦横比を指定できないんだからpx単位でもしょうがない」←この部分はどうなのよ

[練習 1]
幅 200 px * 高さ 100 px の画像 hoge.gif があったとする。
HTML 文書内に <div>練習<img src="hoge.gif" style="height:1em"></div>
というマークアップを記述し、ブラウザに表示させてみよ。

>>217 さんがいて助かりました。
なんで%指定とか言ってる人がいるんだろうね。

で、

文字サイズの固定に目くじら立てる人 = 画像もem単位
文字サイズのpx固定も良しとする人 = 画像はありのまま

だと思うんですが、
文字サイズの固定に目くじら立てる人 で 画像はありのまま
の人がいるかどうか、
いるならば矛盾を感じないかを聞きたいのですが…

>>219
> 文字サイズの固定に目くじら立てる人 = 画像もem単位
CSS で指定する場合はそうだろうけどね。
実際は CSS 未対応ブラウザのレンダリング効率の影響などを考慮して
width,height 属性で指定している場合が多いんじゃない?

textareaのスクロールバーを消すことってスタイルシートでできないですか？

もしくはinputのボーダーをwinIE、Mozillaで消す方法…。

>>221
textarea{ overflow:hidden; }
input{ border:none; }
未確認。

>>223,221
inputはMozilla(NN6)ではどうやっても不可能。あきらめな。

>>224
え? 消せてるんですけれども…。Mozilla/N6 ともに。

>>225
え〜。やって美奈世↓
<input type="text" value="xxxx" style="border:none;">

img要素width/height属性は既に淘汰された。用いるべきでない。

そもそも画像をem指定するなんていう発想そのものが技術者発想だよな。
画質だのデザイナの微妙な画像補正だの思いっきり無視したエゴだよ。暴力的だ。

画像は使うサイズにトリミングした上でアンシャープマスクなど必要な処理をしてpx指定。
画像が固定サイズである以上もちろんtextもpx固定。これは誰が何と言おうが譲れない。
デザイン重視のページの場合ね。
textだけで伝わるようなページでデザインは飾り程度っていうページなら可変にする。

>>226
やってみた〜。まんまコピペしたけど、やっぱり border 消えてるよ。
文書型宣言消してみたらインラインスタイル指定が効かなかった。

みんなキチョーメンなページ作りしてるんだな〜。タイヘンだね。

>>228
ページの趣旨次第だけど、
> 画質だのデザイナの微妙な画像補正
には興味がないユーザーが大部分じゃないですかね。
256 色環境のユーザーもたくさんいますし。

>>229
文字だらけでpx固定だったら最悪。
もう君はサイトを作らなくてよい。

>228
ばーか

だからって企業がピントも合ってないようなボケボケの商品画像を乗せると思うか？
何のために画像使ってると思ってんだ。飾りじゃねーぞ

間違えた(;´Д`)
上のレスは＞228じゃなくて＞233ね

さらに間違えた(;´Д`)
＞233じゃなくて＞232ね(;´Д`)ｳﾄｩだｼﾉｳ

>>234
だからページの趣旨次第だと言っているだろーが。
ユーザーが画質を重視する場面は当然あるだろうさ。

234 と 229 は別人だと思うけれど、
もし商品画像と説明を掲載したようなページで
「デザイン重視」とかってフォント固定してたら
その時点でオレその商品を検討項目から外すだろうな。

まとめ。
では、文字はem（もしくは%）、画像はpxってことで・・・

>>239
あぁ気持ち悪い。
PDFにするか(ワラ

>>240
賢明な選択なんだけどな。PDF。

＞238
なんでそこまで意地になる？なんかイヤな思い出でも？
つーかあんたは普段どうやってブラウズしてんのよ？フォントサイズ最大じゃないとイヤなの？
目悪いの？ひょっとして虫眼鏡とか携帯してるの？

ユーザースタイルシートフル活用。目悪いからね。
虫眼鏡なんて役に立たないもの携帯しないって(笑)。

＞238
じゃあ新聞とか読まないの？
「文字のサイズが変えられねーなんてクソだぜ」とかぶつぶつつぶやきながら
虫眼鏡使って新聞とか本とか読んでるのかと思ったよ。

虫眼鏡ね、酔うんだよね。
一般書籍は眼から 5cm くらいの距離で読んでる。
長時間は読めないよ。
で、眼から 5cm の距離で PC の画面はキビシイんだよ。

>もし商品画像と説明を掲載したようなページで
>「デザイン重視」とかってフォント固定してたら
>その時点でオレその商品を検討項目から外すだろうな。
何故そのページがフォント固定だからって商品が検討対象外になるのだろう(w
商品関係ないじゃん。字の大きさで商品の価値が変わるものなのか。
面白いよ。

新聞も文字大きくなったね。

本来ブラウザの機能として出来るはずの操作が
出来ない様になっている、って意味で
右クリック禁止のページに会ったような不快感があるんだよ。
うぜぇ、やめやめって感じ。

字の大きさで商品価値は変わらないと思うよ。
でもそれが変更できないってのはなぁ。
商品価値はともかく、企業イメージは低下するね。

だからー、文字がゴマ粒みたいに小さく固定されてると
その商品がいいものなのかどうなのか、値段はどうかとかも
何が書いてあるのかよくわからんのよ。

Webという物への意識と理解が企業サイトに現れます。
まあ作ってるﾔｼがｱﾚじゃあしょーがないけどな。

小さすぎるのも困るけど、大きすぎるのも困る。
ちょっと前の解像度が低いノートでは小さくないと不便。
だから、固定しないでほしい。

どっちにしても固定はWeb理解してなさすぎ。
ディスプレイとにらめっこは疲れる。
姿勢崩しながら見るには大きいほうがいいし。
流し読みするときは小さいほうがいい。
色々なケースに当てはまる。人の好みもあるし。
決めるのはユーザー。
「勝手に変えんじゃねえよバカ！」ってのは、
紙とWebの区別がついてないか、自分の目線でしか物が言えない人。

融通の利かない、利用価値の低いページ作ってるってことだよね。

どうせ商品の写真はpxなんだから見えないんじゃないの?
やっぱりブラウザが拡大表示機能を持つべきだな。

>>255
ドリキャスはあるよな拡大表示（藁

IEでもできるね。

>>255
相対指定にすれば画像も大きくできるって上で何度も言っているのだが？

当サイトの推奨視力は 0.7 以上です。
それ以上の環境でご覧になることをお奨めします。

>258

>>220 >>228 >>229

を支持しているからだよ。

>文字見えないトキ
ソース見ればいいじゃんか。所詮ブラウザ次第でしょうが。
…あ、ひょっとしてソースの文字も小さくて読めんの？(w-o-w)

>>261
なんでこういうアホが２ちゃんに・・・（超呆苦笑

俺は固定だ。別に企業サイトじゃない、
ひっそり個人サイトだからな。俺の勝手だ。

駄目かい？

>>263
構わんよ、それで来訪者が減ってもいいのなら。

このスレを見て、今まで12px固定だったのを相対（78％）にしてみた。
普段IEのフォントサイズ「小」でブラウジングてる自分にはちときつい。

でもまぁ、しばらくこれで様子を見てみよう。

確信犯に何言ってもしょうがないよ。
解っててやってるならそれでいいんじゃないの？
知らなくて、そんなつもりなくて固定してるような人には
一度考えてみて欲しいけどね。
考えた結果、それでも文字を固定するっつーなら、俺は止めない。

どうしても「固定＝悪」にしたいんだね。あほくさ。

ブラウザの文字サイズを変更した場合に縦の行間が変わらない方法があったら教えてください。
ちなみにスタイルシートでBOXを使用しているのでTABLEは使えないのです。

>>267
「固定＝悪」てか「非固定＝便利」だと思う。
便利な方がいいと思うのは利用者として自然。

>>268
縦の行間はline-heightの意味ですよね。
今はどういう指定にしていますか？
%やemで指定しても意図通りになりませんか？

固定を主張していたが、相対80%(フォントサイズ：中)でやってみて、
思ったよりしっくりきてビックリだ。
これでもう固定にする理由はなくなったが、
レイアウト的には崩れる。まあいいか、読めれば。

age

フォントサイズって、78％と79％の間に境目（？）があるのですか？
77％と78％は同じに見えるし、79％と80％は同じに見える（IE5.01）んですけど。

>>265さんも78％のようだし・・・

小数点以下の繰り上げ・繰り下げで差が出るんでしょ。

だいたいさ、そうやって計算上はじき出されたサイズで表示されてもさ、
マックだと汚くて読みづらいんだよな。
固定化が「見る側の環境を無視している」みたいなこと抜かすんだったら、
マックユーザでもキレイに見られるようにしてくれや。

絶対値で指定して固定したつもりになっていても
現実にはフォントの違いによって同一にはならないけどな(´ー`)y-~~

>>268
回答は>>270のようにline-heightでいいと思うけど、
「スタイルシートでBOXを使用しているのでTABLEは使えない」
ってどういうこと？

>>261
なんでこういうアホが２ちゃんに・・・（超呆苦笑

>>278は>>276へでした！

>>275
ﾏｸはﾏｸで、見る方がブラウザで調整したらいいんじゃないの？
ページ作成者が固定したらそれすら不可能にしちゃうよ。

俺は強固に相対指定を勧める気はないけど、そんなに絶対的に固定するのに
こだわるのも理解できない。
例えばどんなサイトだと固定しなきゃならないの？
自分のとこじゃなくていいから上げて欲しい。

俺が固定したら固定なんだよ。
マックなんか使ってるやつはみんな死ね。

>>281
もっと素直に「俺以外みんな氏ね」って言えや。

>>281のような人がいるからユーザ補助のすべての項目に
チェックをつける人が出てくるんだよな（藁

でもそれをやると、不適切なHTMLに遭遇すると画面表示が
滅茶苦茶になる…

HTMLにせよ、CSSにせよ、適切に書いてよ（涙

スレの趣旨から外れているのでsage

>>283
それやってるよ。 W3C仕様に準拠してるところはだいたいまともに表示されるのがなんか素敵。

>>269
激しく同意。「固定＝悪」とは俺も思わん。

「固定＝不便＝自分で調整できないので、読めない人が出る」
「相対＝便利＝自分で調整できるので、誰でも読める」だと思う。

なるべく大勢に人に読まれてなんぼじゃないかな、Webサイトは。

個人サイトでひっそりやるのがキボーンな人なら、別に良いよ。
でも、商業サイトや、なるべく大勢に来てもらいたい個人サイトは、
「誰でも読める」を第一に考えるべきじゃないかな。

だから、その意味で（なるべく大勢に門戸が開かれているという意味で）、
「固定＝不利」「相対＝有利」ってことはあるかもしれない。

最初に断っておくが、強要するつもりはない。
俺のやり方ということで聞いてくれ。

・文字は全部相対指定。
・画像はファイルサイズが小さいものと、大きい（本来のサイズ）ものの２種類用意。
・小さい画像を、相対指定で本文中に置く。
・その小さい画像からリンクを張って、別ファイルに大きい画像を絶対指定で置く。

要するに、サムネイル＝相対指定（固定）、見せたい画像＝別ファイルで絶対指定（固定）ということ。

基本的に相対指定派だけど、画像は細部まで固定にしたい俺にとっては、これがベストな方法だと思う。

ラスト２行。

＞要するに、サムネイル＝相対指定（固定）、見せたい画像＝別ファイルで絶対指定（固定）ということ。
＞基本的に相対指定派だけど、画像は細部まで固定にしたい俺にとっては、これがベストな方法だと思う。

↑×　○↓

　要するに、サムネイル＝相対指定（非固定）、見せたい画像＝別ファイルで絶対指定（固定）ということ。
　基本的に相対指定派だけど、画像は細部まで表示したい（固定にしたい）俺にとっては、これがベストな方法だと思う。

間違えた。鬱氏

既出かもしれませんが、自分への戒めも含め情報共有。
スタイルシートは普通

background-color:#ffffff;

等と指定しますが、ＩＥだとコレを

background-color=#ffffff;

でも有効になってしてしまいます。
ある日ネスケで見てみたらマックロな画面にマックロな時・・・
涙が出そうでした。

Javaスクリプト質問スレで聞いたらこっちで聞いたらどうと
いわれました。

<STYLE TYPE-"text/css">
&lt;!--
H1 { font: bold 16pt Verdana; text-align: center;
color: #600060; }
DIV.link { background: white;
border: solid 2px white;
width: 350px; cursor: hand; }
DIV.link A { font: bold 12px; text-decoration: none;
color: #4080FF; }
--&gt;
</STYLE>
<SCRIPT>
&lt;!--
var bc = Array("white", "#4080FF", "#4080FF");
var bs = Array("solid", "outset", "inset");
var cc = Array("#4080FF", "white", "white");
function ChangeStyle(obj, n) {
obj.style.backgroundColor=bc[n];
obj.style.borderStyle=bs[n];
obj.children(0).style.color=cc[n];
}
function DivClick(obj) {
location.href=obj.children(0).href;
}
//--&gt;
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#FF80A0" onScroll="MoveIndex();">


<DIV CLASS="link"
onMouseOver="ChangeStyle(this, 1)"
onMouseOut="ChangeStyle(this, 0)"
onMouseDown="ChangeStyle(this, 2)"
onMouseUp="ChangeStyle(this, 1)"
onClick="DivClick(this)">
<A HREF="hoge.html">　hoge</A>
</DIV>

これをCSSの疑似クラスで指定はできるでしょうか？
また、スクリプトとCSSの部分を外部ファイルに指定したいんですけど
同一テキスト内に一緒に書いてもいいの？
＜スクリプトとCSSを分割したらエラーが出ました。

あ、すいません。疑似クラスで似たようなものが
作れないかどうか、です

疑似クラス（a:hover以外で）に対応してるブラウザって今現在あるの？

>>291
Mozilla と N6 は H1 だろうと DIV だろうと
:hover 効くよ。opera とかはどうなんだろう？

:focusって指定するとどうなるよ?

>>293
どーやってフォーカス移すの？
:active ならともかく。

フォームの input type="file" にスタイルシートでテキスト記入欄の
枠の色を設定したいのですが、そうすると参照のボタンの枠の色も
変わってしまうのですが、何とかテキスト記入欄だけに適用することはできませんか？

>>295
くらす、あいでぃ。
ではダメなんですか？

>>295
ブラウザは何？
input[type=file] は内容モデルとかよく分からんから、CSSでの表示変更はあんまり期待しない方がいいと思うけど。

>297
IE5です。
ちなみにこんな感じです。
<body bgcolor="000000">
<input type="file" name="img" value="" size="30"
style="background-color: #303028; color: #F7F7EF; border: 1px solid #F7F7EF">

fileの参照ボタンとテキストエリアはワンセットだからねぇ。

関係ないけどbodyのbgcolorは"#000000"にした方がいいと思われ。

a:link{} a:active{}などのリンク文字の設定を
同じページの違う箇所で使い分けるにはどうすればいいんですか？

クラスセレクタ、IDセレクタ、子孫セレクタなどを使うとよろし。

すいません、ただのテキストは　.text {font-size:8pt; color:#00CCCC }で
<（タグ） class="text">てな感じで設定したのですが、a:linkなどは
どのように設定したらいいかわかりません。

>>302
例えば、こうすればheadの中のアンカー文字列は黒、
bodyの中のアンカー文字列は白になる。
やり方は他にもいろいろあるだろうけどね。
div.head a:link {
color: #000000;
}
div.body a:link {
color: #ffffff;
}

<div class="head"><a href="hoge">hage</a></div>
<div class="body"><a href="hoge">hage</a></div>

後は自分でお勉強してくださいな。
http://www.google.com/search?q=CSS+%95%B6%96%AC%83Z%83%8C%83N%83%5E&hl=ja&lr=lang_ja

#入れ忘れてました。
fileはやっぱりできないんですかね。

>>303さん
うまくできました。ありがとうございました。

pre > kbd {
text-decoration: underline;
}

上のようなCSSの記述を見かけたのですが、
`>`はどういう場合に使われるのでしょうか？

>>306
ttp://east.portland.ne.jp/~sigekazu/css/css2.htm

>>306
一応解説。
"&gt;"はCSS2の子セレクタ。この場合なら“pre要素内にある”
kbd要素が下線で装飾される（はず）。

因みに
pre kbd { ………… }
と書くと子孫セレクタになる。こちらは子だけではなく、pre要素内にある
kbd要素全てに適用される。
※子セレクタの場合pre em kbdというようなkbd要素には反応しない（はず）。
あくまで直下にある要素のみに適用される（だから子セレクタ）。
こちらはその要素が親要素内にあれば無条件に適用される（他に指定がなければ）。

間違ってたらごめん。

アンクのスタイルシート辞典（紅い表紙ね）を持ってるけど、
もう古いっすかね？

新しくはないけど、さほど悪くもない。
まぁ新しく薦めるならカラー版「詳解〜」の方を薦めるけど。

>>309
1の仕様書で十分じゃない？
どうしてアンクの本買うのかわからん。

<table cellspacing="0" cellpadding="0">

をCSSで書くとすれば、テーブル内の要素に対して
marginとpaddingをゼロに、ていうのでオッケーですか？
それともテーブル自体に記述できるなら
識者の方、ご教授ねがいます

初歩かもしれませんがどうしても知りたいので教えて下さい。
ウィンドウの横も、縦も真ん中にテーブルを持ってきたいのです。
横はセンタリングで容易なのですが、縦が全くうまくいきません。
テーブルの上と下のマージンを％で同じにできる様なやり方はありますか？

>>313

こんな感じかな。

table{
width:50%; /*横幅を親要素の50%に*/
height:50%; /*縦幅を親要素の50%に*/
margin:25%; /*上下左右に親要素の25%ずつ余白*/
}

「センタリングで容易」っていうのがよくわからない。
たぶん text-align:center; のことを言ってるんだと思うけど、
それは間違い。ブロック系要素にtext-alignは効かない。
もしそういう宣言をすると、
IE5では「何故か」（間違いなのに）有効になるけど、
Mozilla なんかでは（正しい解釈に基づいて）無効にする。

>>312

それでOKだと思う。
ただTableまわりのCSS実装が甘いブラウザは多いから、
宣言した通りに実際に表示されるかどうかは別だけどね。
cellspacing 属性なんかは HTML4.01/Strict でも
認められてんだから、無理してスタイルシート使うことも
ないんじゃない？

>>313
>>314
tableの場合、仕様的にはmargin-leftとmargin-rightをautoにする事で
まん中に来る。
上下マージンをウインドウの縦幅にあわせて指定するのは仕様上は無理。

>>312
>>315
HTML4のcellspacingはCSS2ではborder-spacingを使う。
ただし、実際に表示するのはNetscape6/Mozillaのみ。

境界を分離させた表にするとレイアウトが大変……、
padding・border・border-spacing……えっと、marginは無いんだっけ？
よく分からん……。

レイアウトを全部CSSで書いていったらこれだけ残って
妙に気になったので。笑

ありがとうございました
とりあえずはこのままでいきます

教えて下さい。
　フィルターシャドウをかけた文字にリンクを貼ってると、
マウスポインタがリンクの「手マーク」になってくれません。
メニューにこのスタイルを使用してる為、わかりにくいような気がします。

<A HREF="mailto:Question" style="text-decoration:none;">
<span style="width:0;height:0;font-size:20px;color:#FFF452;
Filter:Shadow(color=#005511,Direction=220)">Mail</span></A>

一応、このまま使ってて問題はないのですが、
もし、「手マーク」になる方法があれば、教えて頂きたいです。

順番逆にしたらいいのでは？
<span style="width:0;height:0;font-size:20px;color:#FFF452;Filter:Shadow(color=#005511,Direction=220)">
<A HREF="mailto:Question" style="text-decoration:none;color:#FFF452;">Mail</A>
</span>

>>321
有難うございました。
リンク貼ってるから色が変わるんですね・・・。なんて初歩的な
ところに気がつかなかったのか。自分で恥ずかしいです。

定期船あげ

ページを下にスクロールしても、常にナビゲーションを表示したくて、
次のようにしています。（個人的にフレームは使いたくありません）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
<html>
<head>
<title>WebSite</title>
<style type="text/css">&lt;!--
div.navi{position:absolute; top:0; left:0; width:100%; text-align:center;}
div.main{position:absolute; top:2em; left:0; width:100%; height:90%; overflow:auto;}
--&gt;</style>
</head>
<body>
<div class="navi">
｜<a href="back.html">BACK</a>
｜<a href="#top">TOP</a>
｜<a href="next.html">NEXT</a>｜
</div>
<div class="main">
<h1 id="top"><a name="top">WebSite</a></h1>
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
WebWebWebWebWebWebWebWebWebWebWebWebWebWebWebWeb
</div>
</body>
</html>

上手くいかないのは、ページトップに戻る部分です。

IE5.5だと、イメージ通りになるんです。
上に固定されているナビゲーションの「TOP」をクリックすると、
スクロールする部分（div.main）だけが動いて、見出し(h1)に戻ります。

ところがネスケ６だと、「TOP」をクリックしてもページトップに
戻れないのです。
スクロールする部分（div.main）は全く動かず、ページ全体が
先頭（ナビゲーションの表示部分）に動いてしまうのです。

IE5.5でも、ネスケ６でも同じ挙動にしたいのですが、
どうしたらよいのでしょうか？
どなたか教えてください。宜しくお願いします

>>324

それ iframe みたいで面白いねぇ。
でも、それだとスクロールマウスのホイールが効かないんですけど…。
ウチの環境は Win98 IE5.01sp2 ね。

Transitional じゃダメですかね？

>>324
望む動作に対して理に適った記述を
現状の HTML + CSS でやるのは無理だと思う。
JavaScript でやるしかないんじゃないかなぁ。

>>325
ホイールについては、

　Win2000sp1＋IE5.5sp１→効く
　Win2000sp1＋ネスケ6→効くかない
　Win2000sp1＋ネスケ4.7→効かない

こんな風だったので、単にネスケだけ効かないと思っていました。
325さんに言われて、確かめたら、

　Win98SE＋IE5.01→効かない

こうでした。（デュアルブートになってます＞自機）
Win98がダメなのか、はたまたIE5.01がダメなのか……？

>>326

＞現状の HTML + CSS でやるのは無理だと思う。

（たまたま？）望む通りの動作をする、IE5.5の方が特殊ってことでしょうか？

CSSを勉強し直そうと、アンクのCSS辞書を買おうと思ってました。
他にお勧めCSS本はありますか？

詳解 HTML & スタイルシート辞典：岡倉龍一/秀和システム
スタイルシート Web デザイン：すみけんたろう/技術評論社

とりあえず定番。

訂正。
岡倉→岡蔵

CSS で BR みたいに、強制改行するにはどうしたら良いのですか？

span.test {
display:block
{

では駄目か。駄目だな。

>>332
そもそも、何で<br>以外で強制改行かけたいの？

>>332
<br />使えば?

br ってば物理要素だから使ったら信者にｺﾛｻﾚﾙﾄｵﾓﾀです...

だーかーら、必要なら使えばいいの。 Strict やめて。
なんで Strict 指定してまで Strict でできないことをやろうとするの
かがわからん。

>>336
別に無理しないで使えばいいじゃん。
まぁ確かに物理要素になるんだろうけど、あれば
便利だし。マージンのために連発されると困るけどね（笑）。

どうしてもCSSでやりたいんなら
SPAN:after { content: "\A" }
かなぁ。

>>337
BRはStrictにもちゃんとあるぞ……？

ああそうか。 なんかつられたわ。 ちと逝ってくる

どう考えても視覚表示を前提とした「物理要素」なのに
Strictにあるものと言えば。

hr

これに尽きる。

>>330
ありがとうございました。探してみます。

>>341
smallはどうなんだっけ？
Strictに入ってた？

bigもsmallもStrictで使用可能です。
XHTMLでは使えなかったっけ。

文字サイズを固定するのはウザイですか？
うちは12pxで（最小を）固定しているんですけど。

>>341
XHTML Basicには入ってないので、
それを使ったらいかがでしょうか？
あるいはXHTML 1.1でPresentationモジュールを
外すとか。

>>343-344
XHTML 1.1にもちゃんと(?)入ってますよ。
ISO/IEC 15445(ISO-HTML)からは排除されてますね。

BOX要素でheightを指定する方法ってあります？
ネスケだと無視されちゃいますので。

>>345
おれてきにCSSで文字サイズ固定は『有り』だと思う。
CSSをオフにする手段・もしくはその方法の説明があるならば。

>>348
CSS オフって WinIE4/5 だとレジストリいじることになるけど
MacIE と WinIE6 ではどうなってるの？ 情報きぼーん

BOX要素って何？

ＨＴＭＬリントで、

<BODY> に MSIE 用の属性 `BGPROPERTIES` が指定されています。

なんてゆわれちゃうのをゆわらなくする方法ってどうやるん？

<body>の中にbgpropertiesを指定しなけりゃいいだけだろうが！

CSS オン・オフは JavaScript でやれば良いとか思った。

JavaScript オフ CSS オンはどうすればいいのかと思った。

>>347
Netscape6 はちゃんと height 指定できるんじゃない？
その"ネスケ"ってのが NN4.xx 以前だったらアウト。

>>349
MacIE5では
初期設定>Webコンテンツ
でOn/Off、ユーザースタイルシートの設定が可能。
ただしOffにしたらユーザースタイルシートも
一緒にOffになる(TT)

JSによるスタイル指定について教えてください

ボーダーの色を以下の様に指定したいのですがどうも上手くいきません
document.formName.fieldName.style.border-color=color;

↓の様にすれば可能なのですが
document.formName.fieldName.style.border=color;
これだと色以外の部分も指定しなければならなくなってしまうので
色だけ指定することはできないでしょうか？

Muz Ckashikute York Wacka LAN Ckedo Mar Gunbare YO.

>>357
document.formName.fieldName.style.borderColor=color;
詳しくは DOM2 Style の CSS2Properties を見よ。
http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/css.html#CSS-CSS2Properties

>>359
おっ　上手くいった
ありがとうございます

参照のサイト　かなり役に立ちそうです

>>51
BIG-NET使用者と見た！

ごめん、ミス・・鬱出し脳

>>348
それはちょっと面倒かもしれませんね･･･そんな事でスペースとりたくないし。
style.cssでBodyを変えるんじゃなくて、ページ毎に指定してみる事にします。
（読み物ページは自由に指定できるように･･･とか、メニューは固定とか）
作ってる側では楽だけど、見る側では不便な事があるんですね。Macの事なんて全く考えてませんでした。

font-size:smallにして見て、文字間隔まで変わってちょっとビックリでした（結果オーライだけど）
ちなみにフレーム使ったページなんですが、これもpx指定じゃなく%指定にした方が良いんでしょうか？
（px指定でサイズ変更不可、スクロールバー無しと、今考えると相当ヤバそうなので）
一応確認では、800x600〜1600x1200までOKなんですけど･･･。
Mac信者の友人の手を借りたほうがよさそうですね。

H3やH4の上下が開きすぎるのでやや狭くしたいのですが、
マージンやline-hightを指定してもうまくいきません。
どうすればよいのでしょう？

>>365
Netscape6のデフォルトスタイル@H3,H4
h3 {
display: block;
font-size: 1.17em;
font-weight: bold;
margin: 1em 0;
}
h4 {
display: block;
font-weight: bold;
margin: 1.33em 0;
}
これを参考に調整しましょう。
line-heightは関係ないです。上下のマージンをいじりましょう。
指定が効かないのはブラウザがお馬鹿なのか、あなたの指定法が間違っているか。

>>366さん
どうもありがとうございます。
H4 {
color : #ff0000;
font-weight : bold;
margin : 0.00px;
}
試しにこう書いているんですが、色は反映されるのに、
マージンは反映されないんですよ。
OSはWin98、ブラウザはIE5.0とNN4.7で確認しています。

>>367
試しにやってみましたけど、うちのIE5.5、Netscape6はH4要素へのマージン指定は効いてますよ？
隣の要素のマージンが絡んでるんじゃないでしょうか。
<h4>hoge</h4>
<p>foo</p>
みたいな感じで。

ちなみにNN4.75では効かなかったですね。

マックのIE5ではフォント関係にスタイルシートつかうと
フォームで化けたりテーブルから文章がはみ出したりと
いろいろ不具合があるみたいです。
みなさんどうやって対処してます？
MacIE5のためだけにばっさり落とすのもアレだし・・・・

>>369
対処の必要なし。

>>366 >>368
おっしゃる通り上下のブロックのマージンが関係していました。
PとH4に
margin-top : 0.00px;
margin-bottom : 0.00px;
したら狭くなりました。
thanksです。

>>365 +関連書きこみ
同じ質問しようとやってきたら、既に解決してた！
参考にさせてもらいます。

ところで、Win NN4.7で<BODY style="margin-left: 0px">が効かないのは、
NNが悪いんでしょうか？

>>341
なんで? 「視覚系ブラウザでは」水平線がひかれるって書いてあるじゃん。ハッキリと。
非視覚系ブラウザならたとえば段落の区切り以上の間を置くとかするでしょ?
どう考えても物理要素なのに、とかいうのは、あたかも視覚系ブラウザのことしか
毛頭考えてない証拠なのでは?

Horizontal Rule　だから明らかに物理要素だと思うけど。
「水平罫線」に理論的な意味はないでしょ？
段落の区切り以上の間を置くというのも視覚的効果に過ぎず。

というか、スレ違な話なのでsage

　<hr>は「段落（だけとは限らないが）の間に意味のある
間を持たす」のだから良いのでは？　大体本にも、

　◇　　◇　　◇

なんてのがあるしね。

　気になるならtitle属性でその理由も書けば良いだけのこと。

horizontal rule という名称自体が視覚に依存してる
しかも水平方向にという指定までされて
縦書きにしてたら vertical だぞ

BODYのマージンを左右それぞれ10％ずつとってるのですが、
テーブルの横幅を100％にするとNN4.7で横スクロールが出ちゃいます。
これはNNのせいですか？それとも何か回避法はありますか？

NN4.7にCSSを適用しないでくれ。

HTMLのselectタグについて質問です。
Netscapeだとfont sizeを使えばselectの縦幅を
変える事が出来るんですが、IEだと変りません。
CSSをバシッと使って、IEでNetscpaeと同じレイアウトに出来ないでしょうか？

>>379 無理。

379>380
ご返答ありがとうございました。

<head>
<style type="text/css">
<!--
span { background:skyblue;width:100%; }
-->
</style>
</head>
<body>
<table>
<tr>
<td><span>AAA</span></td>
<tr>
</table>
</body>

とすると、IEではテーブルの幅いっぱいに文字の背景がつきますが、
NNでは文字の長さだけ分だけに背景がつくだけで幅いっぱいになり
ません。
これはCSSの書き方として正しくないんでしょうか？

>>382
インライン要素にwidthを指定するのは如何かと。
spanをdivに換えてやってみ。
幅が広がらないのはNN4.ｘだと仕方ない。

NN4.xではCSSを使ってデザインするのはかなり辛いよ。
適用されないプロパティが多いし、バグだらけだし。

>>383
ありがとうございます。
N6でも幅100%で表示できました。

age

MAC NS4.7でフレームを切った場合、外部CSSを読み込まないのですが、
この対応策はありませんでしょうか？
最初に読み込まれた時はCSSを読み込んでいるのですが、
勝手にリロードというか再表示されちゃった後に、読み込まないんです。

>>386
ならHTML内に入れてください。

>>387
JavaScriptでMAC-NS,IE、WIN-NS,IE用CSSへ振り分けているのですが、
MAC-NSのCSSだけをは、HTML内に入れることはできるのでしょうか？

>>388
できそう。
document.write で style 要素をヘッダ中に書き出すとか。

>>389
具体的にどのようにすれば良いのでしょうか？
ソースをコピーしてどうにか使っているもので、
自分では書いたことがないので分からないんです。
すみませんが、できればもう少し詳しくお願いします。

教えてクンは逝ってヨシ

div {margin:1em ; border:1px solid; padding:1px}
<dl>
<div>
<dt>あああ</dt>
<dd>いいい</dd>
</div>
<div>
<dt>かかか</dt>
<dd>ききき</dd>
</div>
</dl>

これに近いレイアウトにする方法は何かありませんか？

>>392 dl 直下に div 置かれても困るよダンナ。

dt {
margin:1em;
margin-bottom:0;
border: 1px solid;
border-bottom:0 none;
padding:1px
}

dd {
margin:1em;
margin-top:0;
padding-left:2em;
border: 1px solid;
border-top:0 none;
}

こんな感じか。

>>382-384
随分今さらだけど，
<td style="background:skyblue;">
じゃないのはなぜなの？IE 5，N6 ともに 100% 幅で色がついたけど．

>>394
ああ、なるほど、そういう手があるんですね。
勉強になりました。

>>393
いや、駄目なことがわかっているから質問したのですが・・・。

>>392 >>394
dd が複数ある時はそれじゃうまくいかないと思うけど。
CSS2 に完全対応してるなら

dt { display; ran-in; }
dt:after { content "\A"; white-space: pre; }
dd { border: 1px solid; }

こんな感じにしてもいけそう。
Mozilla でも IE でも今のところ駄目だけど。

あう。これでも複数 dd があるときは駄目だね。
隣接セレクタとかでどうにかならないかな。

>>395
答えた方だけど。
セルに背景色を指定するとは考えてなかったんだ。(笑)
span要素だったし、他にもセル内に要素があったのかなー、と。
ただ色つけたいだけならそれが簡単やね。

今日ちょっと本屋のぞいてみたらさ、翔泳社からスタイルシート辞典っていう
CSSだけの本が出てたので買っちゃった。
欲しかったんよね。これまでのは、タグ関係の本におまけで付いてるようなのが
多かったからね。
1800円。まだ読んでないけどよさげだった。

<title></title>
<style>
dt.test {
margin:1em;
margin-bottom:0;
border: 1px solid;
border-bottom:0 none;
padding:1px;
}

dd.test {
margin:0 1em;
padding:1px 1px 1px 2em;
border-style:none solid;
border-width:0 1px;
}

dd.close {
margin:1em;
margin-top:0;
padding:1px 1px 1px 2em;
border: 1px solid;
border-top:0 none;
}

</style>
<dl>
<dt class="test">あああ</dt>
<dd class="test">いいい</dd>
<dd class="close">ううう</dd>
</dl>汚いけど、これならどうにか。

う、最下行の改行忘れた。

>>400
アンクのやつ？
まぁ悪くはないけどね……IEのビジュアルフィルタも載ってるし。

height(高さ)30%のDivボックスの中のテキストを
下詰にしたいのですが、どうしたらいいでしょうか？

div.box{padding:auto auto 1% auto;}
というやり方では出来ませんよね・・・？

DIVボックスの中にDIVボックス。

<BODY marginwidth=0 marginheight=0>
の代わりに
<BODY style="margin:0px">
っていうのはNN4.7では不可能なの？

>>399
なるほど．
＞span要素だったし、他にもセル内に要素があったのかなー、と。
までは考えてなかった．

input type = submit
はボタンのデザインが変更できるのですが

input type = file
はどうすればボタンのデザインを変更したり
参照... 以外の文字にしたり出来ますか？

ひょっとしてこれは無理なのでしょうか？

GW AGE

>>405さん
すみません…具体的にお願いします…m(__)m

border:1px dotted
<option>タグに効かせる事は出来ないのですか？
<input><textarea>のように･･･

>>411
Mozillaならできるかもしれません。
つまるところブラウザの実装次第です。

旧スレより下がってるのでage。

div要素の幅をウィンドウ幅と同じちょうど100%にしたいんですけど
左右にマージン10ピクセルずつ出てしまいます。
なにかいい方法があるのでしょうか？
そのマージン部分にピタリとはまる別のdiv要素
を作ればいけましたが、なんだかスマートじゃないので・・・

body { margin:0; }

は使ってるよね。

414です。

bodyにはマージンがデフォで入るんですね。
いろいろ試したけどそれは盲点でした。
ありがとうございます。

う〜ん・・・
positionとか、marginとか、paddingとかいじってみたけど、
どーしても、ボックスの中のテキストを下詰めにできない・・・(T^T)

誰か教えてください〜〜m(__)m

>>417=404
padding-topを大きめにとるのじゃだめなの？

>>404
%じゃない、pxやptではだめなのか？

>>417
下詰めはCSS1、2ではちょっと無理。
position: relative でずらすとか、paddingだよねぇ。

それでもだめなら
vertical-align:bottom

>>421
vertical-align: bottom は「その行の最も低い要素に位置を合わせる」
だから、ブロック要素の中で下詰めはできないはず。
それに日本語だとあんまり意味無いと思う。

ドキュソな質問なのですが、<font size="2">はスタイルシートで指定する
際には何emなのでしょうか？

>>418さん
padding-topを大きめにとると、横に三分割したレイアウトが
崩れちゃうんです・・・

>>419さん
全画面ではない状態でも、きちんと三分割の高さがほぼ同じでないと
レイアウトが・・・。すみません・・・

>>420
CSS1.2では無理なんですか…。う〜む・・・（汗

>>421
詳解HTML&スタイルシートを買って、それを試してみたんですが、
どーもできないみたいです・・・。


結局、断念することに決めました。
レスをくれた方々、ありがとうございました。

>>423
適当にあたりを付けてem指定したものと、fontで指定した物を並べて比較すれ。
人に聞くより自分でやった方が勉強になるぞ。

>>404
<div style="height:30%; position:relative;">
<div style="position:absolute; bottom:0;">
hogehoge
</div>
</div>

>>424
ブロックを2重にして、中のブロックをpositioin:absolute;bottom:0;としてみては？

<div style="height:100%;width:80%;position:absolute;top:0;left:20%;">
<div style="position:absolute;bottom:0;">
テキスト
</div>
</div>

こんな感じで。

既に試されてたら御免。

かぶったし。
鬱氏

できた！！　できました！！！
ありがとうございます！！！(T^T)感動

>>426さん
>>427さん
レスありがとうございます！！！！

>>423
Netscape6で試してみたところによれば
0.625em, 0.8em, 1em, 1.125em, 1.5em, 2em, 3em
がそれぞれのフォントサイズと同じになるね。
IE5だとまた違うみたいだけど。

ところで404と似たような内容だけど、
文字や画像を画面のど真ん中に持ってくるってできるでしょうか?
<TABLE WIDTH=100% HEIGHT=100%><TR><TD ALIGN=CENTER VALIGN=CENTER>hogehoge</TD></TR></TABLE>
みたいなの。

>>430
俺も知りたい

>>430
<div align="center"></div>ではダメなのか？

>>432
そうすると画面の上部に詰まってしまう。
ど真ん中って事にはならないんですよ。

<TABLE WIDTH=100% HEIGHT=100%><TR><TD ALIGN=CENTER VALIGN=CENTER>hogehoge</TD></TR></TABLE>

これでええやんか！ごるぁ

あのさ、せっかくCSSのスレなんだし、ALIGNとか使うのやめようや。

vertical-alignは？

>>436
効果をちゃんと知ってて書いてる？
vertical-alignはブロックレベル要素の縦方向センタリングに使う使うものじゃないよ。
たとえば、HTMLの<sub>や<sup>等を表現するのに使うんだよ。
インライン要素にしか適用できないし。

んで、結局できないの？

<DIV style="position:absolute;top:50%;left:50%">

NN6で外部スタイルシート使うとbodyのフォントの種類が反映されないんですが
これって私の根本的な書式違反なんでしょうか?

って別に難解な書式でもないし....

>>440
FAQ かも。 @charset で符号化方式を明示しよう。

フォントサイズの指定は、ptとpxではどっちがいいんでしょう？

>>442
何を重視するかで変わってくると思う。

>>442
対象がディスプレイならpx。
印刷前提ならpt(mediaでスタイルシートの切り分け推奨)

フォントのサイズをpxで指定するとIEとネスケで違わない？

>>441

ありがとうございました。
おかげさまで原因を潰せました。

が、しかし、...
bodyのスタイルがtableに及ばないってのは正しい解釈なんで
しょうかね....

>>445
＞フォントのサイズをpxで指定するとIEとネスケで違わない？

IE、ネスケ、ほぼ同じサイズ。
ただWINのネスケ（嫌いだー！）は12px以上にしないときつい。

>>447
NN4.xの場合、CSSでまともにデザインできるとは思うなかれ。

>>448
http://kanzaki.com/index.html
まともにやっちまうヤツもいるから侮れん。

>>449
なるほどね。
ここでたまにマウスホイールが効かなくなるけど、
それもスタイルシートなんだろうか？
文句つけるわけではないけど。

>>439
それだとど真ん中を起点とした位置から右下の区画に描画されてしまう…

>>446
俺も前から疑問だったんだけど、
bodyのスタイルがtable内に引き継がれないのは正しいんだろうか?
IE5もNN6もそうであるところを見ると正しいのかもしれないが不自然だと思うんだよなあ…

>>451
＞bodyのスタイルがtable内に引き継がれないのは正しいんだろうか?

bodyだけでなくtdにも指定しなきゃいけないから面倒で面倒で…。

body, table, td { ほげほげ } とかやってもダメ？

>>453
ぬ、もしかしてこれが面倒だという話ですか。

>>454
そういうことです。
面倒というより、なんか直感的じゃなくてすっきりしないというか、
「なんでbodyの子要素のくせにbodyの属性が引き継がれないのさ?」
っていう疑問を感じるというか…
なぜtableだけ例外なのかねえ、と。
あ、でもそれいったらinputやtextareaとかもbodyのフォント設定引き継がないか。

>>439
>>451
もし、DIVの高さがemなりpxなりで予測できるなら、
例えば100pxだとすると
margin-top:50px
で擬似的に中央に来る。
ただし、position:absoluteでtopの%値に関してNN6の解釈は
仕様書からすれば間違いだけど。

margin-top:50px
↓
margin-top:-50px

>>430
画像
<img src="hogehoge" style="position:absolute; width:auto以外の値; height:auto以外の値; top:0; bottom:0; left:0; right:0; margin:auto;">

一行以内の文字
<div style="position:absolute; width:内容が一行に収まる値; height:%とauto以外の値; top:0; bottom:0; left:0; right:0; margin:auto; line-height:heightと同じ値; text-align:center;">
hogehoge
</div>

いずれもNetscape6では可能。WinIE5.5sp1では不可。
それ以外のブラウザでは未確認。
複数行に渡る文字では行数を予測できるのなら可能。

amayaでの表示が正しい表示って考えていいのかな？＞CSS

初心者ですいません。画像にリンク張るときの
　<A HREF="〜.html"><IMG SRC="〜" border="〜"></A>
でマウスポインタが画像に触れた時に border の色が変えられるスタイルを設定する方法がありましたら教えていただけないでしょうか？
　A:hover { color: 〜 }
ですとテキストリンクの色はポインタが触れた時に変えられるのですが画像の枠色は変えられなかったです．．．
JavaScriptで画像を切り替えればそれでもすむ話なんでしょうが．．．よろしくおねがいいたします。

>>460
ボーダーではないけど、
<table cellpadding=1>の中に画像を入れて、
セルの背景色をCSSで変えるっていう手もある。
cellpaddingがボーダー幅。

>>460

　大抵のブラウザではデフォルトのスタイルとして、

　A:link IMG { border: 2px solid blue }
A:visited IMG { border: 2px solid red }
A:active IMG { border: 2px solid lime }

　と指定されている。画像にリンクを張るとボーダーが付くのはこのため。よって、このスタイルを変えてやればよい。例えば･･･

　a:link img { border : 0.1em solid #0099ff; }
　a:visited img { border : 0.1em solid #9900ff; }
　a:active img { border : 0.1em solid #ff0000; }
　a:hover img { border : 0.1em solid #ffcc00; }

　のように記述すればスタイルを上書きできる。

　但し、色はともかく太さや形状を状況によって変化させようとすると正しくレンダリングできない場合があるので注意。

>>458
＞いずれもNetscape6では可能。WinIE5.5sp1では不可。
あんま意味ないね。

462さん、ありがとうございます。461さん「なるほど、その手もあったか！」って感じです。ありがとうございます。

>>461
ここはスタイルシートスレッドなので…

普通に（HP作成ソフトで）tableとかで作ったテーブルの枠線に
影とかじゃなくて、色の付いた枠線を付けるにはどうしたらいいですか？

table{border-style:solid;}

多分こういうのを期待してるんだと思うけど、どうでしょう>>466

>467
有り難う御座居ます！枠に黒い線が出ました。
外枠だけでなくてマス目状態で線を引きたいんですが…どうすればいいでしょうか？
あと、色を変えれますか？
すみません…初心者で…これから勉強したいです。

>>468
border-color: #RRGGBB;
で色が付く。

升目状態だったらTDにスタイル指定したらいいのかな？フォロー求む

td{border-style:solid;border-color:#ffffff;}
でやってみたら、マス目状に線が引けました。
こう云うのも有りで大丈夫なのでしょうか？
>468 ども有り難う御座居ました。

<table style="background-color:#000;">
<tr>
<th style="background-color:#fff;">cell</th>
<th style="background-color:#fff;">cell</th>
</tr>
<tr>
<td style="background-color:#fff;">sall</td>
<td style="background-color:#fff;">sall</td>
</tr>
</table>

とか。cellspacingとかのスタイル指定が確かネ6ではあったような気
がするけど、IEはどうなんじゃろ？

まぁ、tableにtable入れてspacingを1にするのが一番綺麗ではあるけど。

>471
あ、こんな感じな枠線が理想なんです。
Macだから？？か普通にやったら影付いた感じで盛り上がってるけど
上のでは綺麗に線引いた感じで。
やり方いろいろ有るんですね(*_*)勉強になりました、ありがとうございます。

さらに table に border-collapse: collapse; を設定してみると幸せになれるかも…
N6では無視されるけどIE5ではOK。

一番汎用的なのは>>471の言っているように
<table border=0 cellpadding=0 cellspacing=0><tr><td bgcolor=#000000>
<table border=0 cellspacing=1>
<tr bgcolor=#ffffff><td>左上</td><td>右上</td></tr>
<tr bgcolor=#ffffff><td>左下</td><td>右下</td></tr>
</table>
</td></tr></table>
ってすることだろうね…。これならIE2〜とNN3〜で同じ効果が得られる。
全然CSSの話じゃなくなっちゃうけど。

>473
ありがとうございます、ネスケ表示もバッチシでした！
collapseとか何なのか判らないけど後で調べてみます。感謝です。

>>473
調べてみたらWINのIE5でしかサポートされてない。
NN6は半端に効くらしい。

これと全く同じ事ってCSSでもできる？

<TABLE WIDTH="100%" HEIGHT="100%" ALIGN="center">
<TR><TD VALIGN="middle" ALIGN="center">

<TABLE>
<TR><TD ALIGN="right">hogehogehogehoge</TD></TR>
<TR><TD ALIGN="center"><IMG SRC="hoge.gif" WIDTH="200" HEIGHT="300"></TD></TR>
<TR><TD ALIGN="left">hogehogehogehoge</TD></TR>

</TD></TR></TABLE>
</TD></TR></TABLE>

鬱だ、下から２行目の</TD></TR>は無視してくれ。

>>477
垂直方向で真ん中に持ってくるのは、
CSSでは無理だって聞いたような気がする。
確信はないですが。

display: table-cell;
vertical-align: middle;

を使えば万事解決。

tableのborderを1pxにする方法ってありませんか？

>>480
どうもです。
どっちみちTABLEを１つは使わなきゃ無理って事ですよね？

>>482
layerとかで出来るんでないですか？
色々試してみて下さい。

table要素を使わなくても
「table風の表示」を使えば実現できるってこと。
#CSSのスタイル指定はHTML文書の要素の意味に影響を与えません

>>481
上の方でやってんじゃん。読みなよ。

age

HTMLでWindowsのダイアログっぽいFORMを作っていて
(fieldset/legend/label/accesskeyを使うとかなりそれっぽくなりますね)
1つ悩んでいることがあります。

単純に
テキストボックス<input type="text"> ドロップダウンリスト<select...>
のようにすると全ての要素が下揃えになり
ちょっと間の抜けた表示になってしまうことです。
これを全部縦方向に綺麗にセンタリングする方法はないものでしょうか?

input, select { vertical-align: middle; }
と指定してもラベルの部分が上寄りになってかえって醜くなってしまいます。
そのように表示されるのは仕様を見たところどうも正しいようですが、
少なくとも日本語環境では醜くなるので困ったものです。
なんとか解決することはできないものでしょうか?

FORMでなくてもアイコン画像の隣にテキストを表示させようとした場合にも
いつもこれに悩まされてきました。
画像の場合はIE限定ですが
<img src="..." align="absmiddle">とすると望み通りの表示をしてくれるのですが
absmiddleという属性値はHTML4にもCSSにも存在しないようです。
またIEでも vertical-align: absmiddle; というスタイルは認識してくれないようです。

どなたか良い解決方法をご存知ないでしょうか?

>>487
うちでも似たようなHTMLの書き方をしてるが、
そういう問題は起こってないな。

<textarea>の`wrap`属性（soft）の役目をするスタイルシートってありますか？
white-space:[normal,pre,nowrap]←の三つのどれかでしょうか。

KENTのCGIをAnotherHTML-lintにて、極力エラーを押さえようとしてたら、これが最後にぶつかりました。
どうか、ご教授お願いします。

残念ながら、ないです。

とりあえず Mozilla(N6) の独自拡張で
white-space: -moz-pre-wrap;
というのがあるので、それを使ってみるのもいいかも。

{cursor:hand}（IE)
と
{cursor:pointer}（NN)

これをクロスで実現する方法ってありますでしょうか。

仕様書の翻訳見えねー！
全部□になってる…。ちくしょー！

>>490
まぁ、完璧主義でもなんでもないので、諦める事にします。
N6の拡張って事は、IEでは使えないって事だと思うし･･･
どうも、ありがとうございました。

ボックスの横幅を中身が入る最小のサイズにするにはどうしたら良いでしょう?
<table style="border:1px solid"><tr><td>ほえほえほえ</td></tr></table>
と同じような表示をtable以外のボックス要素で実現させたいのですが…

>>494

<span style="border:1px solid">ほえほえほえ</span>

じゃだめ？
これを<div>で囲めばよさげだけど。

GUEST GUEST

GUEST GUEST

GUEST GUEST

GUEST GUEST

GUEST GUEST

guest guest

guest guest

guest guest

ネタじゃなかったんか…

guest guest

なにやってんだ

>>495
ええと、具体的にはFORMに枠や背景色を付けつつ横一杯に広がるのを防ぎたいので、
spanで囲むのは無理か、もし無理でないとしても避けたいのです。

>>494
margin:0;
display:inline;

>>510
内側にボックス要素を含んでいるからでしょうか、
N6では変わらず、IE5では枠や背景色が消えてしまいました。
やはりtableを使わないと無理なのでしょうかね…

>>509
ﾜﾗﾀ

カーソルを無意味に矢印や十字にするやつはうぜぇよ。

>>513
同意。
ユーザーインターフェースを勝手にいじられるとむかつくね。
本人達はそれがcoolだとか思ってるからたちが悪いよ。
important指定したユーザCSSで普通のカーソルにしちゃうけど面倒。

>>514
狭量だな。在日朝鮮人か？

>>509
オモロイ

疑問がありんす…。
border-styleにあるプロパティのdashedとdottedは
win版のIE5では未対応と書いてあるのに、ウチでは出ます…。
win98SE、IE5.5sp1なんですけど、これってどういうコトなんでしょうか？
それとも5.5か5.5sp1あたりから対応になってるのですか？

>>517
破線と点線だっけ。
対応バージョンはIEで5.5から。NNで6からです。
「IE5」ってのは5.0って意味じゃない？

>>517
その解説が書かれた時点では5.5が出てなかったんでしょう。
ブラウザはどんどん新しくなってくしね。

dottedとdashedの実装については518サンの言うとおり5.5からです。

>>517
IE5.0とIE5.5は別物と捉えるべき。

ま、現状では5.5をスタンダードととらえて、それ向けに作って
いくなんてこと、なかなかできないよな。
せいぜいIE5.0向けといったところか。
NN向けなら、もう、CSSあきらめたほうが早いくらいだし。

くだらないと思われるかもしれませんが、教えてください。
IE5.5で見ているのですが、iframeの枠線は消えないものなんでしょうか。
borderプロパティをいじっても変化しません。
iframeを使っていることを意識させないように作りたいのですが
良い方法ありませんか？

「とほほ」が消えちゃいました・・(ToT)
誰か移転先おしえてください

>>523
http://tohoho.wakusei.ne.jp/

>>522
iframe { border-style:none; }

>>525
回答ありがとうございます。
しかしながら、効果はありませんでした。
何か大事なことが抜けているのでしょうか・・・

frameborder="0"

すれ違いカナ・・・

>>518さん、>>519さん
説明ありがとうございました!!
まだまだ未対応ブラウザの多いプロパティなので、
気軽に使えるのはもっと先になりそうですね。
>>520さん
5.0と5.5はそんなに違うんですか!
じゃあ5.5で動作確認できてても、実際は結構厳しそうですね。

>>522さん
HTMLなら
<frameset(中略)frameborder="0" framespacing="0" border="0">
でできたはずです。これをCSSにすると…
iframe {border-style:hidden;border-spacing:0px;border:width:0px}
…なのかシラ??実際試してないのでちょっとイヤかなり自信ナイですが(汗
↑自信ないなら書くな自分…とは思ったのですが(滝汗

HTML4.01strict＆装飾オールCSSのサイトって、今はどうなんでしょう…？
まだまだアクセシビリティの関係で、やるべきじゃないですか？
XHTMLは流石にやる気しませんが…。

NN4だとすっごいイタイんですよねぇ。
JAVAでブラウザごとにCSS分けるか…それとも…。

>>530
制作側にしても閲覧側にしても、重視するものによって判断が分かれる。
統一見解はまず得られないと思われ。

CSSとJAVAといえば、サイトデザインをJAVAで色々選択してるトコ時々あるな
俺もやろうかと思ったけど、CGサイトじゃ無理だったな
トップ絵のイメージでデザインの幅が狭まる
鬱

JAVA？

そう
ここでそのCSS切り替えスクリプト配布してる
ttp://www.cc-net.or.jp/~piro/
ドウヨ

JAVA?

>>532
JAVA?

Javaと（以下略）。

JAVA TEA?

アタマ悪いスレになってきたな(藁

な・・・なんか誇らしげだっ・・・！
トレパン（マサルさん）みたいだっ・・・！

>>530,>>532
JAVAとJavaScriptの違いを簡潔に述べよ。

>>530
やってくれ。
でないと普及しない。

NN4.xはJavaScriptでスタイルを適用させないようにする。
JS無効にしておけばスタイル切れるし、JS有効でもスタイルは切れる。
CSSでデザインする場合は、NN4.xで意図したスタイルを表示できないのは覚悟すべき。

>>530
そもそも、アクセシビリティーを考えるからこそ、
”HTML4.01strict＆装飾オールCSS”になるのでは？
まぁ難しいところではありますが。
一応俺はJavaScriptでスタイル振り分けてるけど、
やっぱりNN4は悩みのたね。

実際問題、ＮＮ4.xユーザってどんくらい？
自分無視しちゃってるけど

>>544
まぁ減ってはいるだろうけど、無視できるような割合ではないと思うよ。
あなたのサイトの内容、ターゲットにもよるけど。

>>544
具体的な数字はわからないですが，大学なんかにある UNIX マシンの場合は
管理者が積極的に働かないかぎり NN4 が多いのではないかと．
ひどい時には NN3 ってこともありますね．

装飾はすべてCSSだからホント悩む。DHTMLも使ってるし

>>545
とりあえず、「4.x無視すんなやｺﾞﾙｧ!!」ってクレームは来てない（w
けど少しは考えないとまずいね

>>545
そういやうちの大学、去年までNN3ダッターヨ。
鬱だスクリプト書こう…

うちの大学は全部NN4(.7)@NT4だな……
教授方も詳しい人以外はIE使ってないっぽいし。
鬱だ。

>>527>>529
ありがとうございます。
完璧にできました。
どうやらＣＳＳにとらわれすぎていました。

背景をページの右下だけに表示させるにはどうしたらいいんでしょう？
BODY{background-color : #ffffff;
background-image : url(bg.gif);
background-repeat:no-repeat;
background-attachment:fixed;background-position : 100%;}
ってやってるんですけど、高さが中途ハンパな場所になっちゃうんです。

>>542
NN4.xにCSSを適用させない為だけにJavaScriptに依存するのは本末転倒。
寧ろ、仕様に合致したUAを普及せん為にも全ブラウザに積極的にCSSを適用し
仕様に合致しないUAはOSもろとも撃沈する勢いで。

IE5以上向けに、サイトをCSS大量使用にしたとたんにNetscapeサーチとか
いうのに登録されて、アクセス解析でUA見るとNN4ばっかり。

鬱だ氏脳

>>550
background-position: はひとつだけ指定すると横位置だけの指定に
なって縦位置は中央になるので、それだと高さは中途半端になる。
background-position: 100% 100%; とするか、
background-posision: right bottom; とすればオッケー

>>553
出来ました！！
ありがとうございます！！

リンキングスタイルシートって、便利だけどページ自体は
やっぱり少々重くなるんですか？

>>555
少々どころかモノによっては激重。

重いといえばIEのfilter重い
独り言sage

見出しの文字間隔を画面いっぱいに広げたいんだけど、
やりかたきぼんぬ。昔の記憶ではジャスティなんとか
とかいうやつだったように記憶しているんだが。

<h1 style="width:100%;text-align:justify">見出しの 文字間隔 を画 面いっぱいに広げたい 見出しの 文字間隔 を画 面いっぱいに広げたい 見出しの 文字間隔 を画 面いっぱいに広げたい</h1>

>>559
ならないね。ひょっとして、まだブラウザが実装してないのかな？

>>555さんへ。
それってリンクにCSS使うことですか？自分はサイト造りを
生半可な知識でやっとりますが、Onmouseでアンダーバーが出て
文字色を変えるのを設定した途端に超重くなったので。。。

>>560
559のstyleにこれを追加してみ

text-justify:distribute-all-lines;

あと、width指定はいらないと思う。NNでは無効

>>559-560
ほれ
<h1 style="text-align:justify;text-justify:distribute-all-lines">見出しの文字間隔を画面いっぱいに広げたい</h1>

>>561
それはトラフィックと関係ないよ。
グラフィックボードの調子（性能）が悪いんじゃない？

ていうか…OnmouseってJavaScript？
普通hoverでやるよね？

>>564
。。。そうでした。
active,hoverなんかでやっとります。
ただどんなＰＣでもなんですよ。
画像も少しだけ軽いのを（５ｋくらい）使ってるし。
勉強だな、こりゃ。。。どうもでした。

>>565
うちはhoverでbackgroundにアニメGIF入れてたりするけど問題なし。

うちではhoverでbackgroundにアニメGIF入れるとポイントした時IE5.01ではすげー重くなる。
N6ではスムーズ。

>>551
> 仕様に合致しないUAはOSもろとも撃沈する勢いで。
いや、さすがにこれはちょっと……JavaScriptで切ってもいいんじゃないですか。
ぬるい信者ですな、我ながら。雑談気味sage。

>>551
いっそのことそうしたい！すっきりしたい！でも！ううう。。。

ＸＨＴＭＬに準拠したページを作っています。
ｈｅａｄ内にスタイルを書くとＮＮ６で見るとスタイルが無視されるばかりか、
スタイルとして書いたものがテキストとして表示されてしまいます。
テキストとして表示される問題はＣＤＡＴＡセクション内に書くという方法で
解決したのですが、相変わらずスタイルが無視されます。
ＤＬのことを考えてスタイルをページと一まとめにしたいので、外部ファイルの
使用は避けたいです。
ＩＥ５では問題はないのですが、先頭のスタイルが無視されるらしく、
それを回避するには一対のカッコ（「{}」・「()」など）を入れる必要が
ありました。ＮＮ６の方の問題もバグだと思うのですが、
何か解決する方法はあるのでしょうか？

>>570
ファイルの MIME が text/html であれば
N6 は ファイルを html パーサに通すから
CDATAセクションで書く必要はないはずだ。
style 要素の書き出し部分があやしそうな気がする。
<style type="〜" から 5 行くらいここに貼り付けてみ。

>>571さん

レスありがとうございます。ＭＩＭＥはｔｅｘｔ／ｈｔｍｌです。
スタイルは、

<style type="text/css">
<![CDATA[
head {
display : none;
}
body {
color : #666666;
background-color : #ffffff;
font : bold 100%/1.5em "MS PGotick", "Osaka", "Interface System"; sans-serif;
}
.line {
padding : 1% 0% 1% 0%;
border-width : 0em 0em 0.1em 0em;
border-style : solid;
border-color : #999999;
}
#info {
padding-top : 0%;
line-height : 1em;
font-weight : normal;
text-align : right;
}
.name {
font-size : 120%;
}
.date {
font : normal 75%/1em monospace, "Osaka";
letter-spacing : 1px;
}
]]>
</style>

です。先頭のｈｅａｄに対するスタイルは、一対のカッコを
書くためのダミーです。

IE5.5 on Win2Kで
<td bgcolor="red">
とやるとセル全体に色がつくのに、
<td><em>〜
として、読み込みCSSファイルで
td em{background-color="red";}
とすると文字がある部分にしか色がつかん。
なんで？

>>573

td要素じゃなくてem要素に対してスタイル付けしてるんだから当然じゃん‥‥

>>573
記述もおかしい

セレクタ使えば？

>>574
なるほど。そういう考え方なのね。

>>575
う〜〜〜む。厨房なんでわからん(T

要は、特定のセルを目立たせるんだけど、
CSSを切った場合とCSSを使う場合で両立させたいから、
<td bgcolor=...>じゃなく<td><em>を使いたいんですわ。

<td class="emphasis" bgcolor="red"><em>強調文字</em></td>

td.emphasis{ background-color:red }

セルを目立たせたいなら、こうするしか。非推奨。

>>576
td em{background-color="red";}/* 間違い */
td,em{background-color:red;}/* 正しい記述 */
コンマだけの間違いかと思ったら、イコールとか使ってたのね･･･
HTMLとは記述が異なる事を知るべし。

>>577
さんきゅー。
でも、それは使いたくないから、あきらめるです。

>>578
イコールは書き間違いだす。
んで「td em」は
td要素の中のemを定義してるつもりなんだが、
「td,em」だとtdと、td外のemも定義されるんじゃないの？

マニュアル本を買おうにもどれがいいかわかんないので、
よそのサイトのソースを見て、try&errorで勉強してる段階だす。

アンクのCSS辞典（第2版）はどう？　いいデキかと。

td,emだとtdとem全部にスタイルが適用されちゃうね。
tdの中にあるemを指定するならtd emが正解。
他のセレクタの使い方もあるけど、ブラウザの実装考えたらこれが妥当かと。

>>576
> CSSを切った場合とCSSを使う場合で両立させたいから
コレがそもそもの間違いじゃないか？
属性値とCSSで同様のことをさせようという考え方が。

CSSいらないじゃんね

>>580
そら、CSSだけ書いてある本だけに詳しくていいと思う。
けど、索引が超使いにくい。本の最後の方がごちゃごちゃ
しすぎだと思う。それがなけりゃな〜

>>584
ああ、確かにそれは感じた

aリンクされたimgのborderを、CSSで無くしたいんですけど、
IEでは簡単にできましたが、NN4だと、全く反応してくれません。
（aとimg両方にborder-style:noneしたりもしましたが。）

何か、スタイルシートでの記述方はないでしょうか？

>>579
ところで仕様書読んでる？
仕様書きちんと読めばマニュアル本はあまり必要ないと思うが‥‥

原文
http://www.w3.org/TR/CSS2
日本語訳
http://www.nets.ne.jp/~okahashi/

>>586

div {
　background-color: white;
}

a.img {
　color: white;
}

<div>
<a class="img"><img src="〜" alt="〜"></a>
</div>

くらいしか手はないかと‥‥

>>588
おおー、できました！　ネスケはcolorなんですね。
どうも、ありがとうございました。

>>589
というか、border:none; でどうよ?

>>590
それで良し

>>580
読んでみるです。
昔、嘘だらけのプログラミング本を読んだんで、
アンクにはいいイメージもってなかったけど。

>>582-583
いまCSSを覚え始めて、
HTMLは論理記述だけ！　修飾は全部CSSでやるぞー！
と意気込んでいる時期なんで。
ひととおりマスターすれば飽きると思うけど。

>>587
いっちばん最初に読んで挫折した。
いまなら概要はわかってるから、理解できるかもね。
やはりそれが王道か。

CSSでは使用するプロパティは殆ど共通だし、直感的に指定できる。
後はセレクタの使いかた、インラインとブロックレベルの違い
ブラウザの実装さえわかってれば本は必要ないような気がする…。
CSS解説してるサイトだってたくさんあるしね。

金が惜しくなければ買ってもいいと思うけど。＞本

つーか下がり過ぎなのでage

colgroupがあるのにrowgroupがないのはなぜ？
レンダリングに必要ないから？
論理記述には必要だと思うけど。

>>595
そのための thead, tbody, tfoot です。

marquee をユーザースタイルシートで
止めることって出来ないでしょうかね？

>>596
ん？　横じゃなくて縦だってば。
たとえば
ttp://www.tsp21.com/sports/npb/standings.html
の表で、ジャイアンツ〜ベイスターズのrowgroupと、
ホークス〜ファイターズのrowgroupみたいな。
（別々の表にしたほうが見やすいかもという話は置いといて）

複数のtbodyを書けばそれがrowgroupになるってこと。
（CSS2のdisplayプロパティのtable関連の値に関する記述を見れば、
tbody=rowgroupということがよくわかる。）

すたいるしーとってなんですか

>>600
HTML文書などの見た目を定義するものです。
以上。

>>573
ゃゃスレ違いの話題かと思われ。

>>599
おー！　了解！

う〜む。
<colgroup class="foo">と
<tbody class="bar">とのクロスしたセルの属性を
CSSで定義することはできないのだろうか？
仕様書読んでも、実験しても、いまいちわからん。

>>597
marquee{display:none}

>>605
そーか、見えなくしちゃうのか。思いつかなかった。
まぁ、それもありかな。サンキュー。

だめもとで質問〜〜！
JavaScriptで別ウィンドウを設定する方法がありますけど、
（window.open(..,"width=200,heigth=100")ってやつ）
スタイルシートでも同じ事って、できますか？
いま、仕事で要求があって、色々調べてるんだけど、
Javascriptの方法しか見つからないー。

>>607
初心者スレでも突っ込み入れたけど、CSSじゃ無理。
あくまで「HTML文書の見た目を定義するもの」であってウィンドウのリサイズはできないよ。

初心者スレではお世話になりました。
やっとあきらめがつきました。
ありがとー！

body.td { letter-spacing: 1px; }
などとすると改行がおかしくなるのはIEの仕様ですか？

具体的には、
<:br> → 普通に改行
<:br><:br> → これまた普通に改行されるだけ
<:br><:br><:br> → これでようやく間に1行あく
となるのですが・・・。

NN4.7では改行/1行あき/2行あきと表示されるようです。

ありゃ、セミコロンがコロンに・・・

<:br>（<;br>？）って、何？
まぁいいや。
IEだとletter-spacing関連でそんなバグがあったような気がする。

>>612
あれれ、＆ｌｔ；を＆ｌｔ：と打ち間違えただけだったんですけどね。
；がなくても表示されるのかな？

それはともかく、バグですか。どうやらIE6βでも直っていないようです。むぅ・・・
ご返答ありがとうございました。

>>613
チョトワラタ

>>613
直接<>書いてもいいんだよ。

でもかちゅ〜しゃだと<br>が改行になっちゃうんだよねー

display: compact;
はIEでは無効なのですか。

>>617
IEに限らず、Mozillaでもサポートしてない。
正確にに表示できるブラウザは今のところ無いはず。

<option><select>〜</select></option>のプルダウンメニューに
<input>などの入力フォームのようにフォーム枠などを装飾したいのですが、
うまくいきません。これはできないものなんですか？

<option>の中に入るのは<select>だけだっつうの。
仕様書見てからきやがれ。

select の中に入るのは option だけね。 つられてるぞ(w

失礼しました。そのプルダウンメニューの枠の色を
変えたりといった装飾は可能ですか？

>>622 Mozilla0.9 だと optgroup 要素に枠がつけられたぞ。

>>619＝622
　　border-width:1em;
　　border-color:#ff0000;
　　border-style:solid;

>>624さん
下のようにしましたが、見た目かわりません。
どこがだめですか？

<style type="text/css">
<!--
select {
border-width:1em;
border-color:#ff0000;
border-style:solid;}
-->
</style>
</head>
<body>
<form>
<select>
<option>11111</option>
<option>22222</option>
<option>33333</option>
</select>
</form>
</body>

逝ってよし<br>オマエモナー

>>616
ならないじゃん！

>>619
select要素のborderは、アクティブでない状態での枠のことです。多分。
ドロップダウン表示したときの枠を変えるなら

option { border-width: 0 thin; }
option:first-child { border-top: thin; }
option:last-child { border-bottom: thin; }

のようにoption要素のborderで調整するしかないんじゃないかと。
（:first-childの使い方間違ってるかも。自信なし。）

ちなみにIEでoptionのborderを指定できたかどうかは未確認。
Mozillaなら確実にOKですが。

上のソースだとアクティブじゃないときの見た目もかわりませんでした。

625のソースです

>>619
IE5.5だとoption要素に枠は付けられません。

>>632さん
お答えありがとうございます。
はっきりわかってよかったです。

WinIEの場合、セレクトのボックスはブラウザではなくOSの機能で提供されてんのよ。
だから他のフォーム内に使う要素と毛並みが違う。
いまんとこborderを指定してレンダリングさせるのは不可能だったはず。
今までこれで悩んでた人たくさんいたし、解決策も見つかってないからね。

>>628
WinIEではoptionにborder指定は無理だよ。

body{border:1px solid #454545;}
とかって書くとIEではページの端きっちりに枠がつくんだけど
ネスケ(4.7)だとコンテンツの幅分にしかなりませんよね。
body内に透明GIFを使って横幅を確保しようと試したけど無理がありました。
透明GIFの縦をパーセンテージ指定しても効かないし。
調べ方が悪いのかも知れませんが、IEと同じに表示させる
書き方は無いのでしょうか？
テーブル入れ子で同じ様に見せる事も出来るけど、
使いたくないので、知ってる方がいたら教えて下さい。

>>635
body { margin:0em; }

>>636
ありがとう。試してみたけど駄目でした。
ネスケ4.Xじゃ無理なのかもしれませんね。
やはりブラウザ内の端全体じゃなくて、文とか画像の周りに枠がついてしまいます。
<style type=text/css>
<!--
body{border:1px solid #454545;}
-->
</style>
ありがと。

>>635 その CSS 解釈は IE のバグだから、調べれば調べるほど
まっとうな書き方は出てこないよ。

>>638
そうでなんですか。バグでもいいバグだとも思ったのですが。（笑
フレームを使うのも嫌だし、他のデザイン試してみます。
ありがとうございました。

>>626=627
つーか >>616 を読んだ段階で気づけよ(藁

NN5って出るのかな？いっそCSS完全未対応にしてくれ

質問です。

タグにWIDTHとHEIGHTを入れてイメージのサイズを指定するのと
CSSで指定するのとではどういう違いがありますか？

HTML文法採点でこれについてだけ突っ込まれたので…
（減点ゼロ、１００点満点 ^^）
CSSで指定する方がメンテナンス性が高いので
こちらでやってたのですが、不都合が出るようなことがあるなら
タグに指定してやろうと思っています。

詳しい方、どうぞよろしくお願いします

>>641
『もじらクラシック』とかいう名前で廃棄されたんじゃなかったっけ？

>>642
何のタグ？

tableとかtdだとしたら、
主にCSSが効かないことが間違いなく予想される環境の場合など、
解像度に依存しない大きさで図表を表現できるようにするため、
CSSで大きさを指定するのが望ましい、とされる。

imgなら、width属性とheight属性で指定してもCSSのプロパティだけで
指定しても、どっちでも全く問題ないが、
<img src="hoge" alt="hoge" width="200" height="100" style="width:200px;height:100px;">
としたほうが尚良いだろう。
個人的にはstyle属性のほうは、emとかの単位にしたいのだが、bodyのフォントサイズ
自体をmediumとかにしており、厳格に指定できない以上は、画像を相対サイズで
指定するのはかなり困難というか…。

>>644

あ、すいません、imgタグです。即レスありがとうございます。

つまり、どっちともやっとくのがベストってことですね。
ナルホド…
しかし、片方だけでいいならCSSだけにしようかな。
構造以外の要素はできるだけHTMLの方に入れたくないし。

参考になりました、ありがとうございます。

別に非推奨じゃないんだし、HTMLタグ内に書いてもいいと思うのだが。
少なくとも俺はそうしている。
borderは非推奨だからCSSでやっているが。

>>645
>構造以外の要素はできるだけHTMLの方に入れたくないし。
画像の場合って、画像ごとにクラスとか作るの？
現実的にはstyle属性になるような気がするんだけど、だったらwidth/height属性も
併記したって大して変わらないというか。

画像ごとにクラスとか作るので、うまいやり方があるのなら、むしろ
知らないので誰か教えて。

タブ型のナビゲーションバーを作りたくて
<A>にwidthを指定したいのですが、
IE5ではOKでN6ではNGだったので、
<SPAN><A></A></SPAN>のようにして
<SPAN>にwidthを指定しようとしても駄目でした。
ついでにN6ではbackgroundも駄目でした。
どうやったらwidthとbackgroundを指定できますか？

>>646
タグ内に書いてもいいんですけど、ソース編集のときに
それだけがCSSで管理できない部分があると思うと
なんとなく気持ち悪いので…
ホントそれだけの理由です。

>>647
僕はstyleもほとんど使いませんので
（これも特に理由があるわけじゃないですけど）
画像ごとにクラス作ってます。
うーむ…でも…
言われてみればstyleで指定した方が良いのかな…

>>646さん、>>426さんの話聞いてると
なんとなく、皆さんそうやっておられるようですね。

>>648
多分書き方が間違ってる。
例えばN6では、htmlの文書型宣言でstrict宣言してて、
CSSで
width:100;
（px等の単位を書いていない）
などと指定すると無視されたりする。

>>642
たとえばwidth: 100pxの画像を使うとして、
それを50pxや200pxにするのなら見栄えの調整なのでCSS、
100pxのままならレンダリング処理の補助なのでHTML、
と分けて考えるのも一案かと思う。

Javascriptの出力部分がこれです。
document.write("<DIV class=\"nav\">");
for (i=0;i<=max;i++){
document.write("<SPAN class=\"");
if(category==name[i]){
document.write("nav_active");
}else{
document.write("nav_normal");
}
document.write("\"><A href=",dir,url[i],">",name[i],"</A></SPAN>");
}
document.write("</DIV>");

んでもってCSSがこれです。
a{text-decoration:none;color:#000099}
a:hover{text-decoration:underline}
.nav{border-bottom:1px solid #999999}
.nav_normal,.nav_active{width:64px;text-align:center}
.nav_normal{background:#cccccc;color:#666666}
.nav_active{background:#999999;color:#ffffff}

divの2重構造にしたら?

>>653
改行されてしまいますが(^^;

divをインラインにしてみては

divの二重構造＆内側のdivはposotion: absoluteにして横に並べる

>>654
そのためのfloatでは。

N6でうまく<A>に背景色がつかないと思ったら、
Classに_が含まれているためだったようです。
後はwidth...

>>652
つか、わざわざMozillaで試してから気づいたが、
クラス名にアンダーバー（_）は使えないYO・・・・・・

しかもかぶってるしさ、鬱出氏のう・・・

また問題が発生しました(^^;
背景色まではうまくいったんですけど...
<DIV style="float:left;border-bottom:1px solid #cccccc">
<DIV style="float:left;width:64px...">Top</DIV>
<DIV style="float:left;width:64px...">BBS</DIV>...
</DIV>
といったかんじでタブみたいなナビゲーションバーに
したいのですが、
border-bottomとしているにもかかわらずN6では
線が入れ子になっているDIVの上に表示されます。
IEと同じように下に表示したいのですが、
どのようにしたら良いのでしょうか。
<HR>等も試しましたが隙間が空くので・・・

>>661
今頃書くのもなんですが、

<div class="nav">
　　<a id="contents1" href="〜">Contents1</a>
　　<a id="contents2" href="〜">Contents2</a>
　　<a id="contents3" href="〜">Contents3</a>
</div>

div.nav a {
　　display: block;
　　float: left;
　　width: 64px;
　　...
}

こんなかんじにすればいいのでは？


floatにした要素は、親要素の中から下にはみ出して配置されることがあります。
http://www.asahi-net.or.jp/%7Esd5a-ucd/css1/test/ja/sec5525c.htm
線を下に表示したいのなら、個々のdivのborder-bottomを指定してみてはどうかと。

あ。spanやdivを入れ子にしなくてもaで事足りるんじゃないの、ってことです。

そういや、フロート指定した段階で、その要素はブロック化されるんじゃなかったっけ？
だったら、displayでわざわざ指定しなくてもいいような。

imgはHTML側で指定してくれないと見るときにちょこまかして酔う

>>661
いっそのことボーダーの指定は内側のdivにしちゃえば？

ついでに簡単に書いてみたけどこんな感じのこと？
http://www.petit-charat.f2s.com/

<table rules="groups">
と同等の指定はCSSではできないのだろうか？

試しに
tbody.hoge{border: red solid 3px;}
とやっても全然効果ないから、そこから先に進めない。

>>667

thead, tbody, tfoot, colgroup, col { border:solid thin; }
td, th { border: none; }

>668
ども。
でもWinのIE5.5とNN6では
table外枠以外の全borderがnoneになる。
実装が追いついていないのかも。

>>667
tableの枠云々は見た目というより表の構造そのものだから
rulesに相当することはCSSで規定するよりHTMLに記述するほうが正しい気がする

今フォントサイズをどの環境でもそれなりに統一させたいと思い
色々サイト見てたんですが、px指定もあまりよくは言われてないですが、
MacのブラウザはもうIE5が主流ですか？普通のユーザーは72dpiに設定
しなおしたりして使ってるんでしょうか？？そのまま96dpiで使用して
るんでしょうか？

>>662
N6では<A>にはwidthが効かなかったです。
あと入れ子のBorder-bottomを試してみます。

>>671
Macが72dpiだっけ？俺も切り替えてみるかな。
MSゴシックがもっときれいだったらこんなにフォントの事で悩まないんだけどな。個人的には。

<ul class="list-main">
<li class="list-main">
<ul class="list-sub">
<li class="list-sub">

みたいにulの入れ子構造でulとliのclass名を同じにしていいの？
とりあえずIE5.5ではちゃんと描画してるみたいだけど、
ちょっと混乱するような気がするし、
でも意味的には同じだから同じ名前のほうがいいような気もするし。
それともulとliの両方にclassを指定する俺の設計がタコなのか？

良スレ…ウンウン(^ー^)

>>672
width は非置換インライン要素に指定しても無効。

>>674
異なる要素に同じクラスを指定すること自体はまったく問題なし。

>>672 あ、display:block してたんだ。逝ってくる。

>>674
別にかまわんと思うが、それは何か意味あるのか？

>>676
ばんざーい！

>>678
それでは逆にきくが、意味がないのか？
てゆーかさー、674では「設計」なんて書いたけど、
ほんとはネタ本見て実験しながら、修飾要素を1個ずつ
HTMLからCSSに移しただけなのよ。
つまり本質は理解してないのね。

ということに、678への返答を考えてて気づいた。
プレーンなCSSから再設計してみるよ。
ありがとー。

>>679

<ul class="list">
　　<li>
　　　　<ul>
　　　　　　<li></li>
　　　　</ul>
　　</li>
</ul>

ul.list { 〜 }
ul.list li { 〜 }
ul.list ul { 〜 }
ul.list ul li{ 〜 }

子孫セレクタを有効活用しましょう。

>>680
ul.list li
は考えついたけど、
ul.list ul
みたいに同じセレクタを子供にできるとは思わなかった。
HTMLもCSSもすっごいわかりやすくなったよ。
ありがとー。

age

安芸

Webのファイルをまるごと落とせるソフトでページを保存してるんですけど
画像ファイルがスタイルシートで書いてあると保存してくれません。
ヘレンとかいうソフトなんです。だめみたいです。
なにがいいですか？簡単なのがいいです。

>>684
激しく板違い。作者に言うなりそ板へ逝くなりしてくれ。

あげとく

>>684
画像を記述できるスタイルシート言語って、何?

>>687
backgroud-image:url(xxx)
とかのことだと思われ

backgrond ってなによ。う津田篠う

つーか更に間違ってるし。死に体。

>>687,>>688
list-style-imageということもありうる。

>>688-690
あなたオモロイ

hr要素で水平線の太さを指定したいのですが、
border-widthを1emと指定しても太くなりません。
どうすれば、太くできますか?

>>693
そりゃwidth,heightの方だ。borderじゃないよ。

関係ないけど、<hr>にborder-topとborder-bottomを指定して、
それぞれの色を違う明度にすると凸凹を表現できるよ。好きな色で。

>>694
できました。ありがとうございます。
線を引くのではなく、中身の無い四角形を置いた感じですね。

>>695
ありがとうございます。試してみます。

hrにborderを設定するとNetscape4で愉快な結果になる。

NN4.ｘはブラウザじゃないからいいんでは？

>>699
まぁ…アレでも一応はブラウザでしょう。(笑)
NN4.xで本格的にCSSを使おうというのは間違ってると思うけど。

>>698
気になる。どんな結果になるんだー？

age

画像を右に寄せたり中央に持ってきたりするにはどーすれば？
alignって廃止ですよね？

alignって廃止なの？

>>704
HTML4.01では非推奨で廃止方向だね。
Transitionalには暫定的に残されているが。

>>703
こんなかんじ。↓

<p class="image-block" style="text-align:right">
<img src="hoge.png" alt="hogehoge">
</p>

>>701
まずはやってみれ。

age

>>705
アリガトーゴザマス！！

div,table{text-align:center;}
<div>
<table><tr><td>2chマンセー</td></tr></table>
</div>
IE、ネスケではセンタリングされますが、Mozillaではセンタリングされません。
Mozillaに対応したスタイルシートでのtableのセンタリング方法なないでしょうか？

あと、<hr>のスタイルシートでのセンタリングは
hr{align:center;}←これで良いのでしょうか？
一応通ってるけど、とほほには[text-align]しか載ってないし･･･

>>709
どっちも
margin-left: auto;
margin-right: auto;
でいけるはず

>>709
よいセンタリング方法を知らないので下げるが、
それでセンタリングできてしまうのは IE のバグだ。
この辺↓に詳しく載っている。
http://mentai.2ch.net/hp/kako/987/987003410.html

つまり、Mozilla の挙動が正しい。

>>710 の方法だと、IE4あたりだとセンタリング
できなかったんではなかったっけか？

>>709
おお、できた！どうも、ありがとう。

>>710
tableの方ですよね。
hrの方は、ネスケがそういうふうになっていて･･･
あ、これってバグかな？向こうに書いたほうが良いのかも。
現在のうちに来る人のIEのバージョン統計は
5.0 (56.0%) / 5.01(29.7%) / 5.5 (12.1%) / 2.0 (2.2%)
↑この通りです。2.0が気になりますが、必要な時まではこれでいきます。

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

widthを指定した<div>を中央に配置したいんだけど、IEじゃ無理？
align属性使うしかないんかな。

>>713
さらに div で囲む。
親の div に text-align:center を指定。

>>714
あっ、そうか。ｻｿｸｽ。
無駄なタグ書きたくないけどIEがmargin-right(&left):autoに対応するまでそれで逝くわ。

ageage

用法にもよるけど、
body { text-align:center; }
ってのはダメ？

>>717
ダメじゃないが、キミの考えていたのとは違うと思われ。

あの後色々試してみたけど、自分の場合、

body　　{ text-align: center; }

div　　　{ text-align: left; }

div内　　{ text-align: 任意; }

結局こうするのがいいみたい。
親（ここではbody）をセンタリングすると子要素の中身まで
全てセンタリングされてしまうんで、divで左寄せに戻さないとダメ。

それが抜けてたからうまくいかなかったんでした。
みんなｻｿｸｽ。

age

>>719
中央に配置する div の幅を % 指定にしてもいいなら
div {
text-align: left;
margin-left: 10%;
margin-right: 10%;
}
とかでもいける，と思う．やりたいこととは違うかもしれないが．

CSSの実装バグを集めたスレがあったと思うのだが見つからない。

Netscape6でbodyを
background: url("foo.gif") top right fixed no-repeat;
と定義して右肩にマークを置きたいのだけど
縦スクロールバーの領域を避けてくれないのはバグかな？

>>721
ありがとう。でも絶対指定（500px）なんだわ。
ボックスに背景画像ノーリピートで貼ってるから。

>>722
原因は fixed みたいだね。無指定（scroll）だとスクロールバー避けてくれる。
対処法は思いつかないんだけど、
「top right」 の部分を「99% 0%」にすると少しは･･････ダメ？

バグ辞典スレッドは逝っちゃったらしい。

CSSバグ辞典スレはサーバ移転の際に逝ってしまったようだ。
http://mentai.2ch.net/hp/kako/987/987003410.html
よければ誰かパート2立て直してくれ。

「これ一冊読めばお前はCSSﾏｽﾀｰだ」という究極の参考書を教えて下さい。

↑仕様書(ﾜﾗ

>>725
何か巷じゃ、すみけん氏のが名著だと言われてる。
探したが見つからなかったので判らん。

「CSS」の本ってあまり出てないよね

>>727
すみけん氏の「スタイルシートWEBデザイン」はブラウザの実装云々よりも、CSSの仕様を理解したい人向け。
他の本は対応ブラウザの記述があると思うから、初心者はそっちの方がいいかもね。

>>725
何かを読んだだけじゃマスターできないよ。
実際に自分でCSS使っていろいろ試すのが一番かと。
仕様書の理解だけじゃなく、各ブラウザのバグをきちんと把握して
それを踏まえた上でコーディングできないとマスターした事にはならないような。

優良スレあげ

>>726
まあ正論ですね(w

やはり実践あるのみですかね。
今までWEBのリファレンスサイトだけでやってきたんですけど、
本も一冊くらい持っとかねばと思ったんで。
『スタイルシート辞典第2版』は買いでしょうか？
うちの周辺の本屋ではこれしか売ってないんで他のと比べようがないんですけど。

>>728
> 各ブラウザのバグをきちんと把握して
でもこれって結構難しい…思い通りにいかないときに
バグなのか仕様なのかわからないことっていっぱいある。

>>731
そうなんだよね。
そういう所を仕様書見て潰していかないといけないし。

http://www.zspc.com/documents/css2/index.html
既出だけど参考までに。

>>730
アンクのやつね。
初版は評判悪かったけど、第2版は信頼できる。
私はこれを片手にCSSをマスターした（つもり）

CSSでbackground-colorを指定せずにcolorだけを指定すると、
以前ならW3C CSS Validatorで警告が出てたけど、
久しぶりにValidatorに掛けたら警告が出なくなっていたよ。
Validatorが改良されたみたいで、W3Cへの帰依が深まったよ。

ガイシュツだったような気もするが
(ていうか俺自身ここで教わって買った気がするが)
秀和システムの『詳説HTML&スタイルシート辞典』良かったぞ。
HTML4とCSS2対応、
HTMLは各要素がStrictとTransitionalとFramesetで
それぞれ定義されているかどうかわかるようになってるし、
HTMLもCSSもN3〜N6、IE3〜IE5と現在使われている主要なブラウザで
対応しているかどうかわかるようになっていて実用的。

俺も土曜日に買ってきた
　詳解HTML&スタイルシート辞典』
辞典としてはいい本だね

スタイルシートの考え方を会得したいから、すみ件のも買う予定

とりあえず辞典みながら自サイトのひとつをスタイルシートに変えたけど
ブラウザ毎に違って見えて

個々のブラウザの違いを設定で補っても限度があるし、どうしても
レイアウトを崩したくないときにはスタイルシートって今の段階では
役立たずなんだな。

>>736
クライアントをIE5とN6以上に限定すれば、というかNN4を無視すれば
CSSを使わないより正確なレイアウトが実現できると思われ。
そしてHTMLの書き方次第でCSSに対応していないブラウザでも十分内容が読めるページができる。
http://www.seniornet.ne.jp/
ここすげえよ。模範的なCSSの使い方を体現してる。

>>737
sugeeeee...

http://www2.plala.or.jp/macco/1ndex.html

>>739
何ですこれは？　見てきたけど

テーブルを使わずに↓みたいなことできますか？

各セルの幅、高さは固定して動かさないようにしたい

xxxxxxxx┌───┐xxxxxxxxx
xxxxxxxx│画像　│xxxxxxxxx
xxxxxxxx└───┘xxxxxxxxx

今まで三つのセルを使ってたんですが・・・
スタイルシートのみで可能ですか？

<p id="1stCol">xxxxxxx</p>
<p id="2ndCol"><img src="hoge" alt="hoge"></p>
<p id="3rdCol">xxxxxxx</p>

とかHTMLでやっておいて、CSSの方では

p#1stCol{
width:200px;
height:200px;
overflow:scroll;
float:left;
}
のようにFloat指定する。

ちょっと遠めの本屋行って『詳説HTML&スタイルシート辞典』買ってきました。
色々オススメあげてもらってありがとございまー
んじゃぱ。

NN4め…。
<head>に埋め込んだのは解釈するのに、
外部CSSだと読み取らないご様子。
俺だけですか！？
それともそういうバグなんスかねー。
NN4はイロイロと鬱。

>>744
>>724にも書いてあるけど、
CSS、DHTMLバグ辞典スレッド
http://mentai.2ch.net/test/read.cgi?bbs=hp&key=../kako/987/987003410
に載ってない？色々と書いてあるよ。
載ってなかったら詳しく報告くれれば、誰か答えてくれる……かも。

あー、誰か2.0立て直してー。

>>744
家は大丈夫だけどなぁ。
<head><link rel="stylesheet" type="text/css" href="style.css"></head>
う〜ん、記述を間違ってるなんて事、ないよね？

スタイルシートのファイル名変えたら、しっかり表示が変わったよ。

>>744
外部CSSにmedia指定してると蹴られるよ。
正確にはmedia="screen"以外を指定した場合だったかな。

>>742
floatをつかって色々流し込んでみたんですがどうにも
うまく行きませんでした・・・

画像の片側にfloatで流し込むともう片側に流れてくれない・・・・
テーブル素直に使ったほうがよさそうですね・・・

>>748
参考
http://www.skipup.com/~l-_-l/web/
…のリンク先のNoise(笑

まんなかの画像をブロック要素にしてしまえばいいかもね。

BORDERCOLORLIGHT="#xxxxxx"
BORDERCOLORDARK="#xxxxxx"
をCSSで指定することはできないんでしょうか。

>>750
それってIEの独自拡張だったはず。

テーブルを使うならこうかな？

table
{
border-top: 5px solid #ffffff;
border-right: 5px solid #000000;
border-bottom: 5px solid #000000;
border-left: 5px solid #ffffff;
}

枠線の上と左を白に、右と下を黒にした例です。
思い通りにならなかったらスマソ

>>751
それだとテーブルの最外枠しか変わらないような。
tdやthなんかにも指定せにゃ。

>>749
動作原理がいまいちよくわかりませんが、うまくいきました！
並べたい数だけfroat:leftで流し込めば、並んでくれるんですね
ありがとうございました！

もうちょっとテーブルを使わないでがんばってみます

>>751
てゆーか、inset とか outset 使えれ。

>>745〜>>747
自分的に特にイタイのが、background-imageが出ないコトです。
background-colorは出るんだが…。因みに一括指定でもダメ。
IE5.5sp1とNN6ならちゃんと出てるのに…。
補足として、javaスクリプトを使ってCSSを分けてたりしてます。

『詳説HTML＆スタイルシート辞典』の話題が出てますね。
アレ、端に書いてある対応ブラウザ表記、たまに違いませんか！？
NN4でdisplayがで使えないとかいって、全然OKだったし。
float対応と書いてあるのにダメだったし…。

全ての悩みはNN4にあり…かもf(^^;

>>754
insetとかoutsetってブラウザ間に色の違いがあるでしょ。

>>755
background:url(back.gif) repeat;
漏れはこうしてる。
IE5.0だと、CSSと同じディレクトリのback.gifが、
NN4だと、HTMLのディレクトリのback.gifが表示された。

NN4.xにも対応させるなら、
>>757のように同じ画像を複数のディレクトリに用意するか、
画像のURLを絶対パスで書く。

>>755
一括指定でも背景画像が出ないならNN4.xのバグで、パスがずれてるんだよ。
IEやN6は「CSSからのパス」、NN4.xは「CSSを読み込むHTML文書からのパス」になる。
HTML文書とCSSを同じディレクトリに入れてる場合は問題ないけど、
別ディレクトリに入れた場合は絶対パスで記述するべし。

>>756
inset,outsetに限らず、全ての視覚系ブラウザで同じ色を表示するのは、
事実上不可能では？
実際、自分のページを、IE5.5で開いた時と、N6で開いた時では
全然違う色になる(insetとかでなくてただの背景色)のに驚いたことがある。
気にはしてないけど。

仕事用のCRTと家の液晶でも全然色違うし。
MacとWinでも変わるんでしょ？Mac持ってないから分からないけど。

ie5.0って、子孫セレクタに対応してないんですか？

http://www.zspc.com/documents/css2/index.html

ここ読んでメチャ鬱になりましたよ・・

>>760
CRTと液晶で変わるのは、
色を表現するアプローチが根本的に違うから。
CRTでも種類によって違う。

MacとWindowsで変わるのは
主にデフォルトのガンマ値が違うため。

IE5.5とN6で違うのは・・・
違うか？
ほとんど変わらないと思うけど。

>>762
指定する色によっては全然違う色になることも。

>>762
256色環境とか16bitカラー環境だと色の再現方法とか違うんじゃない?
あんまり違う場合は記述ミス("#" が抜けてるとか)のような気がするけど。IE って確かそういうのも補正するから。

inset,outset,ridge,grooveのボーダーなんかは、IEとN6で結構色が違うよね。
background-colorはそれほど変化無いと思うけど…。

>>761
漏れIE5.01SP2だけど子孫セレクタ効きてるよ。

>>761
ああ、ほんとだ。これはZSPCが間違ってるね。
WinIE4でも子孫セレクタ使えるよ。

子孫セレクタの説明に
「意図しない部分にスタイルが適用される場合がある。」
とあるから、×じゃなくて△になるべきだね。

age

いままでフレームを多用してるページから
スタイルシートに書きなおしてるんだけど

今の分かりやすいデザインを変えるつもりはないからそのままの形を
再現させようとしてますが一つのテーブルを書きなおすのに何時間もかかってます
そのほとんどの時間はIE５とNN６の間で整合性をとるために・・・・

スタイルシートは微調整の戦いのような気がしてきました
せめてブラウザごとで崩れなければこんなに苦労しないのに

スタイルシートの時代になっても結局
ブラウザ毎の細かい調整からは逃れられないのか…

デフォルトのマージンとかブラウザによって違うからね

>>772
一旦全部クリアするような指定を入れておけばいいんじゃないの？
で、その後全部再定義して。
もちろんこれらのスタイル指定は@inportなりなんなりで使い回せるようにしておく。

無駄が多いのは仕方ないけど、それが比較的安全という気がする。

>>767
さっそく、修正されてるよ。

| 【訂正】子孫セレクタの対応状況に間違いがありましたので訂正しました。
| 子孫セレクタの Windows版IE5.0とIE4.0が「×」になっていましたが、
| 実際には「○」です。
| 子孫セレクタのテスト文書で、「セレクタ > セレクタ」や
| 「セレクタ + セレクタ」のテストも同時に行っていたため、
| 結果に影響を与えていました。2001年6月6日。

>>774
2ちゃんねらーだったのか？
まさか？

>>775
私みたいにweb板だけは見ているのかも・・・。

そっち方面の人で、ここ見てる人多いよ？

>>774
おお、好感度アップage
管理者の人ここ見てるんですかね?

しかしまだ間違いが…
セレクタ + セレクタ は漏れのIE5.01SP2で効いてるんだけどなあ。
セレクタ > セレクタ は試してないのでわからないがなんとなく効きそうな予感が。

>>778
気のせいじゃ・・・

セレクタ > セレクタ は IE5.5 から。

子セレクタとか兄弟セレクタとか言って欲しい……。

なんかイマイチ直感的じゃないんだよね…
子供セレクタ
子孫セレクタ
隣接セレクタ

まげ

愛人セレクタ
隠し子セレクタ
生みの親、育ての親セレクタ

>>780
マジで？　NN6だけじゃなかった？

つまんねっすよ

スゴクしょうもない質問かもしれませんが、
リンク個別にHOVER属性を設定する事ってできますか？　無理・・・？

スタイル属性を個別に埋め込むか、
リンク各個にID属性,Class属性をつけて指定し分ける

なるほど。　できるんですね。　ID・Classは使った事ないけど
もうちょっと調べてやってみます。
答えてくれてありがとう（ｗ

　え、個別に宣言できたの？　シラナンダ・・・
　でも、HOVERって個別に埋め込めるか？？？
　(そもそも、やってるとこ見た事ないが)

　タグ的にはどんな感じになる？

a.xxx:hover {}
a.yyy:hover {}
a.zzz:hover {}
ってのでよかったよね確か。

style属性で、:hover使えるのは、css3からじゃなかったっけ？

>>791

　ん？　それでできるのかな・・・やってみよう。

あれ、何か間違ってるかな・・・　できないぞ。
ＩＥ５じゃ無理？

>>794
IEは<a>にhrefがないとだめ。
<a href="#" class="xxx">xxx</a>
でどうよ？

age

margin-leftとpotisionのleftの使い分けって、どうなの？
widthとかと関係してくるのはなんとなく分かるが、厳密な使い分けの基準がわからん。

過去スレがないようですので十分に調べられませんでした。
既出だったらすみまそん。

visited状態のリンクにマウスを重ねた時に
hoverの状態にするにはどうしたら良いでしょうか。

ポータルサイトなど情報系のサイトでよくみかけます。
ソースや外部CSSでは普通に指定してるんですよ。
もしかしてJavaScriptなのでしょうか。

スタイルシートで作ってみたものの
うちのページはまだまだIE４とかNN４使ってる人が30％ほどいるので

テーブルを多用したTransitionalで結局逝くことに・・・
今回はCSSのいい勉強になりました

a:visited{ color:red }
a:visited:hover{ color:yellow }

これじゃなかったら、javascriptだろうね。
もしくは、a:visitedにCSSで何も指定してないとか。

>>797
意識の違い（失格かな）

>>797
英単語がわかればわかんないか？

>>798>>800
単に書く順番の問題だと思われ。

a:hover
a:visited

この順番で書くとたとえhover時でも
その後に書かれているvisitedが有効になる

なのでこれを逆に書いて、

a:visited
a:hover

となるようにすればよい。俺はいつも

a:link
a:visited
a:hover
a:active

の順で書いてるけど。

>>803
なるほど。書く順番すか。

うちではlinkのhover と、visitedのhoverで、色を変えてるので
ああいう感じに設定してます。

>>803　さんの順番って大切ですよね。
詳解〜でこれ知るまでさっぱりでした。

(ﾟДﾟ)⊥優良スレage運動実施中

>>806
ガンバレ。
俺もたまにやってるけど、何かクソスレが上位10スレを占めてたりすると鬱になるね。

>>807
どっちかというとローカルルールで糞スレ削除基準作ってネトウォチ板的スレをあぼーんするのが得策と思われ

>>808
支持。

禿禿堂

N6でleftmarginを指定したDIVの中に<HR>いれると
横にはみ出るんですけど(^^;)
なんとかなりませんかこれ・・・

ttp://www.internetclub.ne.jp/TECH/Ztoday/2001/010417.html
JavaScriptでCSSを制御してると考えていい？

>>800,>>803

ご親切にお返事をありがとうございました。
どちらでも正常に動作することを確認しました。
書く順番がポイントなんですね。

＞うちではlinkのhover と、visitedのhoverで、色を変えてるので
＞ああいう感じに設定してます。
おお！そんなこともできるのですか。今度使ってみます〜。

IEでCSSをオフにすることってできないんでしょうか?

>>814
その一
http://www.din.or.jp/~himura/at-works/rubbish/css.html
コレ使う

その二
http://say.vis.ne.jp/script/etc/
この中の『強制スタイル』機能で、空のCSSファイルを指定する

>>814
レジストリに手を加えましょう。
でも ActiveDesktop とかエクスプローラの「Web ページで表示」とか
使ってると一見エラいことになります。

age

>>814
190のieexも参考にしてね。

面倒なことするよりも、
http://www.ne.jp/asahi/minazuki/bakera/html/opinion/disablecss
がいいと思う。
まあ、どうでもいいけど。

>>814
レジストリ触るのがイヤなら、インターネットオプション
の[ユーザ補助]の項目を全部チェックするだけでも随分違います。
css がオフなるわけではないですが。

>>819
ばけらさんのとこで紹介されている方法より
>>190 の ieex を導入すれは、インターネットオプションに
css 有効/無効チェックボックスが追加されますので
はるかに簡単かつ安全（あくまで比較しての問題）です。

IE5と、N6で大きな違いといえば、widthとheightプロパティの継承の仕方ですが、
両者でこれらをそろえる方法はないでしょうか。

IE の width = NS の width+padding を揃えるには、
box-sizing: border-box; -moz-box-sizing: border-box
を加えると IE に合うようです。CSS3 で正式に導入される
らしいのですが、Mozilla 0.9 など既に内々では実装済み
のようで。

>>822
ちなみにMacIE5はbox-sizingに対応してるね。
ｈｔｍｌ * {
box-sizing: border-box;
-moz-box-sizing: border-box;
}
と指定しておけば、大抵の場合は大丈夫なはず。

レス有難うございます。

例えば、

#foo{ width:100% ; margin-left:100px; }

<body>

<div id="foo"></div>

</body>

とした時、IE5だとbodyから100px引いた幅になり、
N6、seamonkeyだと（正しく）bodyと同じ幅になってしまうんです。

>>822-823 さんの方法は指定してみたんですが、どうも別問題のようで困っています。

<table border="0" width="100%">
　<tr>
　　<td width="50%">A</td>
　　<td width="50%" align="right">B</td>
　</tr>
</table>

これと同じレイアウトをCSSで実現するにはどうしたらいいですか？

div#A {width: 50%; float: left;}
div#B {width: 100%;}

<div id="A">A</div>
<div id="B">B</div>

としたけどどうも違うような。アドバイスお願いします。

>>824
IE5と同じ表示にしたいんだったらwidthを指定しなければいいと思うんだけど…。
ブロックレベル要素だし特にmarginを指定しなければ親要素の幅いっぱいに広がるでしょう？

>>820
リンク先読んだ？
鳩丸のところの方法でチェックボックス出るよ。

div#B {width: 50%; float: right;}
でだめ？
いや、確かめてないけど（無責任）

>>827
いや、だからね。
鳩丸さんはレジストリ編集を自分でやれって言ってるわけでしょ？
普通の人は怖くてやらないと思うけど。

ieex 使っても、レジストリを操作するのは一緒だけど
regedit 起動するわけじゃないから、余計なところを触る心配はないので
比較的安全だよ、って言いたいのよ。

まぁ、 ieex のは鳩丸さんのをただインストーラに組み込んだ
だけですので…
inf ファイルでのインストールに抵抗がないひとなら、レジストリ
いじるのもさほど抵抗を感じないんじゃないかと。

>>829
コピペしたregファイルを作って実行するだけだから、余計なところは触らないでしょ。

>>831
む、すまん、その通りだ。ごめん。馬鹿は俺だった。

教えてくださった皆さんありがとうございました、これから試してみます。
ちょっとしたレジストリ操作で詳細設定の項目を追加できるんですね。
IEはこういう拡張性がいいですねー。

あとはDonutみたいなタブブラウザにも
CSSを手軽にオン/オフできるツールバーボタンが加わると嬉しいかな…
暇があればhackして作者さんにソースを送るんだけど。

遅レススマソ、改めて確認してみたら確かに
IE5.01は セレクタ + セレクタ 対応してませんでした。
h2 + p { ... } とかやっても無条件に全ての p にスタイルが適用された。
漏れの勘違いでした。ZSPCが正しいです。

>>833
元々 IE3 で持っていたものを隠すようにしただけで、こういうのは拡張性とは言わん。

>>835
いやいや、CSSをオフにできることじゃなくて、
右クリックした時のメニューや詳細設定ダイアログに
簡単にユーザが項目を追加できるのがいいよなーってことです。
IEじゃないエクスプローラの方もそういう所が良いと思ってきたし。

>>836
どうやったら右クリックのメニューに追加できるの?

HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt
じゃないすか? 具体的な使い方はよく知らないけど。

>>838
フレームを別ウィンドウで開いたり
1つ上のディレクトリに移動したり
海外サイトのページをLogoVistaのWEB翻訳で訳したり
表示しているページをAnother HTML-lintでチェックしたり
選択している文字列をGoogleで検索したり
リンクの張られていないURLからジャンプできるようにしたり
など、いろいろ。
ちょっとした決まりごととJavaScriptの知識があればサルでも作れるので
便利といえば便利。
アイディア次第だね。

>>825
width: 50%はＴＤの要素に入れないとだめだよ
それとＡＢが文字のときはtext-alignのほうがイイよ

NN4 でクリッカブルマップの枠を消すような CSS はできるでしょうか．
<div>
<map name="map" ...>
<area ...>
</map>
<img src="img" ...>
</div>
以上の div, map, area, img に対して
・border: none を指定
・color：transparent（あるいは背景色）を指定
のいずれの場合も消えません．（area は違うと思うが，念のため．）
消えないことを確認したのは Win NN4.75 です．
ご存知の方がいらしゃいましたらよろしくお願いします．

あ，color： → color: の書き間違いです．（書き込み間違いね．ソースは半角で確かめた．）
なさけな…．

>>841
う〜ん、試してみたけど、クリッカブルマプ使ったimg要素は、
スタイル指定が何もかも無視されるような気がする・・・

確信犯による糞レス連立＆age更新対策age

<ul>によるリストで、
・1
・2
・3
とか
　1
　2
　3
ではなく
1
2
3
と表示させる事は可能でしょうか？

>>845
マージン指定すればＯＫ

リストのマージンって、ずれない？妙に調整するとマーカー消えたり。

list-style-type: none
で良いんじゃないのか？

>>843
やはりだめですか…ありがとうございます．

>>845
そもそも それは ol リストを使うべきではないのか？

AとBっていう画像があって
A B　って横に並べて
Bのほうだけ上にテキスト流し込みたい場合、テーブル使わないにはどうしたらいいですか？

テーブルでやるときはBのセルの背景にBの画像をいれて
セルの中にテキスト流し込むんですが

>>851
こんな感じ？
(画像は両方とも100px四方と仮定)


<p id="sample-1"><img src="A.png" alt="A" width="100" height="100"></p>
<p id="sample-2">今日は雨だぜちくしょう</p>

p#sample-1{
float:left;
margin:0;
}

p#sample2{
width:100px;
height:100px;
overflow:hidden;
background-image:url(B.png);
background-repeat:no-repeat;
}

↑p#sample-2の間違い。

IE5で試したらうまくいった。でもMozillaでは妙な表示になるなあ。
達人たちフォロー頼む。

変更になりました・・・・
1 2 3 4 5
のようにリストを横に順序書きだそうです。
内容はメニューの項目です。

とりあえずulとliエレメントのdisplay属性をinlineにしてみたのですが、
Mozillaだとulのマージンが生き残ってしまいます。
IEだとulのマージンは消滅します。

この場合、表示を統一するにはどうしたらいいのでしょうか？
w3c無視しちゃえば全然問題ないんですが。

>>854
ちゃんとULもLIもマージン0に設定してるか?

Mozillaはたしか
ulにpadding-leftが付いている。
パディングを0にしてみたら？

どうしてもCSSを使用する意味を教えてください。
今私の会社ではCSS反対派とCSS推奨派に二分されていて
CSS反対派に対抗できる意見を求めております。。。(私は推奨派)
反対派の意見としては
(1)「じじぃが文字小さいと読めないし、文字の変更が出来ないのはユーザーに優しくない」
(2)「デザイン変更の時もDWで置換すればいいことなので統一CSSを使う意味がわからない」
(3)「そもそもCSS自体わからない」
といったところです。
私の意見としては
(A)「サイト全体を統一したいと言うのならば、外部CSSで文字、色、BGなど統一しておけば
変更のとき外部CSSを修正すればOKなので楽」
(B)「これからCSS対応のブラウザになっていく(？)ハズなので、CSS使用していないとヤバイ？」

(A)の意見に対して反対派の答えは上の(2)で押され、
(B)の意見に対しては「そんなことずっと前から言われていることで
本当にそうなるのはいつかわからない…」と言われ
私一人では反対派に対抗できません。。
どうかみなさんのご意見を伺えたらと思います。
ちなみにうちのサイトはいわゆる情報サイトです。
反対派はYAHOO!信者です。(YAHOOはCSS使用していないというところで)
どうかお知恵を！！！

>>857

＞(1)「じじぃが文字小さいと読めないし、文字の変更が出来ないのはユーザーに優しくない」
【回答】
em使えばいいだろボケ

＞(2)「デザイン変更の時もDWで置換すればいいことなので統一CSSを使う意味がわからない」
【回答】
置き換えよりCSSのが楽だろアホ

＞(3)「そもそもCSS自体わからない」
【回答】
知恵遅れは逝ってください


つーか「(3)」の意見は、本当にプロのWebデザイナーが言った言葉か？

>>856
paddingですか。試してみるの忘れてました。
今別件で素敵な事なってますんで、片づいたら試してみます。

「(3)」は仕事じゃ許されない気がするんだが。
趣味ならともかく。

WindowsとかMacとか、パソコンからのアクセスなら
Netscapeユーザのことを考えるとCSSを使わないで
TABLEやFONTを駆使した古くさいHTMLにした方が
より多くの人に正常でかつそれなりの見栄えで見てもらえる。
だから世間の商業ベースのサイトはほとんどみんなCSSを使わないんだろう。
現時点でYAHOO!がCSSを使っていないのは割と正しい判断だろう。

それでもなおCSSを使いたいならば、俺に思いつく反論としては
・CSSを使って構造と見栄えを分離しておけば
　そのHTMLページは携帯はPDAでも正しくブラウズできる(可能性が高い)
ってのがあるかな。

あと反対派の(1)は間違いだね。
CSSでフォントサイズ指定していてもpt指定やpx指定じゃなくて%指定なら
IEでもちゃんとユーザがフォントサイズを大小させられる。

>>857
うちの会社も同じような人いるよ。そこのチームは情報サイトを制作している部で
何より軽さ命！軽く軽くでロゴも画像も荒くてもそのまんま。
アンチエイリアスオフ大好きみたいで、画像も荒れ荒れ。でもユーザーが
見やすいようにって気持ちはわかるがやりすぎでは？
自社のサイトだから何やってもいいと思ってるみたい。
当然CSSはユーザーに優しくない→フォントサイズが変わらないから
CSS分のタグが増える等で使用不可みたい。
一応WEB制作で金取って他社のページも制作しているみたいで、
どうも情報サイトの感覚だからか退社した人が制作したページでCSS使ってるの
全部外してた。
一体どんなページになるんだろう？
「もうCSSぐちゃぐちゃでむかつく！CSS使う自体怠慢（？）」と
言っていた。

s/携帯はPDA/携帯やPDA/

>>862
つーか軽さ命なら余計とCSS使う方が良いのでは。
やっぱこの業界はまだ「なんちゃって」が多いね。
「CSSはよく分かりません」って素直に言えば良いのに。

>>862
アンチエイリアスオフにしなくたって、
オンだけど4色や8色程度に減色ってやればそう大きく変わらないサイズで
ぐっと見栄え良くなるのにねえ…

つーかそこまでして軽さにこだわるなら
画像なんか使わなきゃいいのに…