CSS/DHTMLバグ辞典スレッド 第３版
http://pc2.2ch.net/test/read.cgi/hp/1066310242/924-
>ページの最下部に表示させたいと思っています。
>文章量が少ない場合（スクロールなし）は、文章の下に空白をとって「見た目の最下部」に、
>多い場合（スクロールが出る）は文章の終わりに、という風にしたいのです。
>すると、IE5.5、Opera7.20では意図通り表示されるのですが、
>Netscape 7.01では常にページの見た目最下部に表示されてしまい、
>文章量が多い場合、文章と重なって一緒に上へスクロールされてしまいます。
>MacOS9.1でも確認して貰ったところ、IE（バージョン不明）でも同じようになってしまうそうです。
ソース例
<body>
<p>1</p>
<p>2</p>
<p>3</p>
……中略……
<div style="position:absolute; bottom:1em; left:50px; color:red;">
フッタ
</div>
<body>
>IE6でもネスケと同じになるよ
とのこと。
Opera7.2だけ異なる表示なわけだが、さてどれが正しい？ バグなのかどうか。
>ページの最下部に表示させたいと思っています。
>文章量が少ない場合（スクロールなし）は、文章の下に空白をとって「見た目の最下部」に、
>多い場合（スクロールが出る）は文章の終わりに、という風にしたいのです。
>すると、IE5.5、Opera7.20では意図通り表示されるのですが、
>Netscape 7.01では常にページの見た目最下部に表示されてしまい、
>文章量が多い場合、文章と重なって一緒に上へスクロールされてしまいます。
>MacOS9.1でも確認して貰ったところ、IE（バージョン不明）でも同じようになってしまうそうです。
ソース例
<body>
<p>1</p>
<p>2</p>
<p>3</p>
……中略……
<div style="position:absolute; bottom:1em; left:50px; color:red;">
フッタ
</div>
<body>
>IE6でもネスケと同じになるよ
とのこと。
Opera7.2だけ異なる表示なわけだが、さてどれが正しい？ バグなのかどうか。
|
|
|
594 ：Name_Not_Found：03/11/18 02:41 ID:???
>>593
え？なんでここに持ってきてるんだ？そのスレの
http://pc2.2ch.net/test/read.cgi/hp/1066310242/929n
これ読んだ？bodyのheightはデフォルトでいいんだけどhtmlとdivはautoなのよ。
だからIE5.5ではOKでIE6（標準モード：IE6の宣言なしは標準）はうまくいかないだけ。
初期コンテナブロック(または>>593の16行目のdiv)のheightが無指定(=auto)なんだから
そうなって当たり前だろ？意図した表示にするためには、これを指定すればいいだけ。
そのかわり、bottomが、ここで既出の
------------------------------------------------------------
http://pc2.2ch.net/test/read.cgi/hp/1066310242/928n
928 名前:Name_Not_Found 投稿日:03/11/17 23:50 ID:???
>>924
関係あるかな？
http://cssbug.at.infoseek.co.jp/detail/winie/b043.html /* こっちのバグ */
http://cssbug.at.infoseek.co.jp/detail/opera/b005.html
-------------------------------------------------------------
>>928のバグに引っかかるので、該当ブラウザではバグるよ、ってことだろ？
え？なんでここに持ってきてるんだ？そのスレの
http://pc2.2ch.net/test/read.cgi/hp/1066310242/929n
これ読んだ？bodyのheightはデフォルトでいいんだけどhtmlとdivはautoなのよ。
だからIE5.5ではOKでIE6（標準モード：IE6の宣言なしは標準）はうまくいかないだけ。
初期コンテナブロック(または>>593の16行目のdiv)のheightが無指定(=auto)なんだから
そうなって当たり前だろ？意図した表示にするためには、これを指定すればいいだけ。
そのかわり、bottomが、ここで既出の
------------------------------------------------------------
http://pc2.2ch.net/test/read.cgi/hp/1066310242/928n
928 名前:Name_Not_Found 投稿日:03/11/17 23:50 ID:???
>>924
関係あるかな？
http://cssbug.at.infoseek.co.jp/detail/winie/b043.html /* こっちのバグ */
http://cssbug.at.infoseek.co.jp/detail/opera/b005.html
-------------------------------------------------------------
>>928のバグに引っかかるので、該当ブラウザではバグるよ、ってことだろ？
595 ：Name_Not_Found：03/11/18 10:21 ID:???
>>594
＞意図した表示にするためには、これを指定すればいいだけ。
html {height:100%;}では表示は変化しなかったよ。
また上のIEバグと違って、topは指定してない。
それに下のOperaのバグはrightの場合だけでbottomは登録されてないみたいだが？
＞意図した表示にするためには、これを指定すればいいだけ。
html {height:100%;}では表示は変化しなかったよ。
また上のIEバグと違って、topは指定してない。
それに下のOperaのバグはrightの場合だけでbottomは登録されてないみたいだが？
596 ：Name_Not_Found：03/11/18 10:28 ID:???
>>594
IE6でDOCTYPE宣言で互換モードにして>>593のソースを表示したが、
やはり「常にページの見た目最下部に表示されてしまい、
文章量が多い場合、文章と重なって一緒に上へスクロールされてしまいます」よ。
IE6でDOCTYPE宣言で互換モードにして>>593のソースを表示したが、
やはり「常にページの見た目最下部に表示されてしまい、
文章量が多い場合、文章と重なって一緒に上へスクロールされてしまいます」よ。
597 ：Name_Not_Found：03/11/18 11:58 ID:???
>>587の後半
Safariは、ブラウザ標準フォントをデフォルトの「Times」に
していると日本語のbold部分が太字になりませんが、環境設定で
標準フォントを「ヒラギノ角ゴ」などに変更すると、ちゃんと
日本語boldが効きます。
じゃあ、日本語フォントを指定すれば大丈夫かと思って「Osaka」
などを指定してもboldは効きません。
でも、DTP用のNewCID「新ゴ」ファミリーなどをインストール
している場合、「新ゴ」を指定するとboldは効きます。「小塚
ゴシック」とかでもOK。「太ゴB101」とかはダメ。
ひょっとして、W3,W6とか、L,M,Bとかいった太さに関する名前の
ついたフォントを指定しないとダメなのかな?
Safariは、ブラウザ標準フォントをデフォルトの「Times」に
していると日本語のbold部分が太字になりませんが、環境設定で
標準フォントを「ヒラギノ角ゴ」などに変更すると、ちゃんと
日本語boldが効きます。
じゃあ、日本語フォントを指定すれば大丈夫かと思って「Osaka」
などを指定してもboldは効きません。
でも、DTP用のNewCID「新ゴ」ファミリーなどをインストール
している場合、「新ゴ」を指定するとboldは効きます。「小塚
ゴシック」とかでもOK。「太ゴB101」とかはダメ。
ひょっとして、W3,W6とか、L,M,Bとかいった太さに関する名前の
ついたフォントを指定しないとダメなのかな?
598 ：Name_Not_Found：03/11/19 01:14 ID:???
WinIE6 で下記のソースを表示してリサイズすると、
thead のスタイルがヘッダ行グループや表要素からはみ出る。
thead にも position: relative; を指定すると発生しなくなる。
レンダリングモードはバグの条件に関係なし。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<title>【(ﾟДﾟ)ﾊｧ？】なんですかこのバグは！？</title>
<style type="text/css">
div {
border: solid thin olive;
margin: 1em; padding: .5em;
position: relative;
}
thead {
color: white; background: olive;
}
</style>
<div>
<p>段落… 段落… 段落… 段落… 段落… 段落… 段落… 段落… 段落… 段落…</p>
<table border="1" align="center" width="90%">
<thead>
<tr><th>ヘッダ１</th><th>ヘッダ２</th></tr>
</thead>
<tbody>
<tr><td>データ１</td><td>データ２</td></tr>
</tbody>
</table>
</div>
thead のスタイルがヘッダ行グループや表要素からはみ出る。
thead にも position: relative; を指定すると発生しなくなる。
レンダリングモードはバグの条件に関係なし。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<title>【(ﾟДﾟ)ﾊｧ？】なんですかこのバグは！？</title>
<style type="text/css">
div {
border: solid thin olive;
margin: 1em; padding: .5em;
position: relative;
}
thead {
color: white; background: olive;
}
</style>
<div>
<p>段落… 段落… 段落… 段落… 段落… 段落… 段落… 段落… 段落… 段落…</p>
<table border="1" align="center" width="90%">
<thead>
<tr><th>ヘッダ１</th><th>ヘッダ２</th></tr>
</thead>
<tbody>
<tr><td>データ１</td><td>データ２</td></tr>
</tbody>
</table>
</div>
補足。どうやら tbody や tfoot でも発生する模様。
600 ：Name_Not_Found：03/11/19 02:57 ID:???
>>592
正解っぽ。
>Arialを指定すると、日本語部分が自動でヒラギノの角ゴになっちゃうみたいな
ちなみに、
font-family : Times , "小塚明朝 Std R" , "Kozuka Mincho Std" , serif ;
てな記述では、日本語部分がヒラギノ明朝で表示されますた。
正解っぽ。
>Arialを指定すると、日本語部分が自動でヒラギノの角ゴになっちゃうみたいな
ちなみに、
font-family : Times , "小塚明朝 Std R" , "Kozuka Mincho Std" , serif ;
てな記述では、日本語部分がヒラギノ明朝で表示されますた。
601 ：Name_Not_Found：03/11/19 19:28 ID:???
【WinIE5.5〜6】
JavaScript無効時、後続hrに背景色を指定してあると、文書先頭の絶対配置要素が初期値を無視して左から50%に配置される。
最初に、IEで下記の通りにJavaScriptを無効にしておく。
メニューバー→[ツール] > [インターネットオプション] > [セキュリティ] > 任意のゾーン（[インターネット]）→[レベルのカスタマイズ] > セキュリティの設定→[スクリプト] > [アクティブスクリプト]→[無効にする]
ソースは次の通り。
<body>
<div id="navbar">メニュー</div>
<hr class="thick">
<h1>タイトル</h1>
……以下略</body>
#navbar{
position:absolute;
z-index:5; top:0px;
}
hr.thick { height:10px;
color:red;/*IE向け指定*/
background:red;/*Mozilla向け指定。これを削るとなぜかバグらない。*/
}
対処法は、#navbar {left:0;} を追加すると正常な位置に配置される。
または<body>直下、div#navbarとの間に任意の文字列をタグで括らないで書き込むと
その文字のすぐ右側に配置される。
アクティブスクリプト有効時、このバグは発現しない。
DOCTYPE宣言（標準／互換モード）も関係ない。
JavaScript無効時、後続hrに背景色を指定してあると、文書先頭の絶対配置要素が初期値を無視して左から50%に配置される。
最初に、IEで下記の通りにJavaScriptを無効にしておく。
メニューバー→[ツール] > [インターネットオプション] > [セキュリティ] > 任意のゾーン（[インターネット]）→[レベルのカスタマイズ] > セキュリティの設定→[スクリプト] > [アクティブスクリプト]→[無効にする]
ソースは次の通り。
<body>
<div id="navbar">メニュー</div>
<hr class="thick">
<h1>タイトル</h1>
……以下略</body>
#navbar{
position:absolute;
z-index:5; top:0px;
}
hr.thick { height:10px;
color:red;/*IE向け指定*/
background:red;/*Mozilla向け指定。これを削るとなぜかバグらない。*/
}
対処法は、#navbar {left:0;} を追加すると正常な位置に配置される。
または<body>直下、div#navbarとの間に任意の文字列をタグで括らないで書き込むと
その文字のすぐ右側に配置される。
アクティブスクリプト有効時、このバグは発現しない。
DOCTYPE宣言（標準／互換モード）も関係ない。
603 ：Name_Not_Found：03/11/19 23:21 ID:???
MacIE5.1で、表の空セルを表示させて枠線を付けると、本来の
セルの大きさより大きく表示されます。
table { empty-cells: show }
td { border: 1px solid }
<table>
<tr><td>xx</td><td>xx</td></tr>
<tr><td>xx</td><td></td></tr>
</table>
これで全セルは同じ大きさになるはずですが、右下の空セルの
枠だけが大きく、隣の枠線と重なってしまいます。
なお、td 要素に background プロパティを指定すると、背景
領域は全セル同じ大きさになります。つまり border だけが
大きくて background は正常な大きさなのです。従って、
border と background の間に隙間が空きます。
なお、この問題は空セルを <td></td> ではなく、<td> </td> と
いう風に間にスペースを書くようにすれば発生しません。
セルの大きさより大きく表示されます。
table { empty-cells: show }
td { border: 1px solid }
<table>
<tr><td>xx</td><td>xx</td></tr>
<tr><td>xx</td><td></td></tr>
</table>
これで全セルは同じ大きさになるはずですが、右下の空セルの
枠だけが大きく、隣の枠線と重なってしまいます。
なお、td 要素に background プロパティを指定すると、背景
領域は全セル同じ大きさになります。つまり border だけが
大きくて background は正常な大きさなのです。従って、
border と background の間に隙間が空きます。
なお、この問題は空セルを <td></td> ではなく、<td> </td> と
いう風に間にスペースを書くようにすれば発生しません。
604 ：Name_Not_Found：03/11/20 01:26 ID:???
【IE6】
リンクをポイントするとIframeのサイズが変わってしまいます。
heightを%以外で設定すれば大丈夫ですが。
<style type="text/css">
A:hover{ color:#0000FF; position:relative; top:1px; left:1px;}
</style>
<body>
<table border=1><tr><td><a href="http://google.co.jp">ぐぐる</a>
<p> </p><p> </p><p </p><p> </p><p> </p></td>
<td><IFRAME src="http://google.co.jp" width="400" height="100%">
</IFRAME></td><tr></table>
これは以下の症状と同じ事でしょうか?
http://cssbug.tripod.co.jp/のバグ038
>WinIE6.0ではアンカーにポイントしたときに要素がずれる現象が起きました。
リンクをポイントするとIframeのサイズが変わってしまいます。
heightを%以外で設定すれば大丈夫ですが。
<style type="text/css">
A:hover{ color:#0000FF; position:relative; top:1px; left:1px;}
</style>
<body>
<table border=1><tr><td><a href="http://google.co.jp">ぐぐる</a>
<p> </p><p> </p><p </p><p> </p><p> </p></td>
<td><IFRAME src="http://google.co.jp" width="400" height="100%">
</IFRAME></td><tr></table>
これは以下の症状と同じ事でしょうか?
http://cssbug.tripod.co.jp/のバグ038
>WinIE6.0ではアンカーにポイントしたときに要素がずれる現象が起きました。
すみません。
css云々ではなく単にhtmlの文法が
間違ってただけかもしれません…。
原因はわかりませんが…。
css云々ではなく単にhtmlの文法が
間違ってただけかもしれません…。
原因はわかりませんが…。
606 ：Name_Not_Found：03/11/20 02:38 ID:???
http://cssbug.at.infoseek.co.jp/detail/opera/b066.html
インラインフレームにz-indexが効かない(6.0/7.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b067.html
:hover擬似クラス状態になることでマージンの幅が変化する
いづれもOpera7.22で見ると、そのページのソース例ではバグは発現しませんでした。
インラインフレームにz-indexが効かない(6.0/7.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b067.html
:hover擬似クラス状態になることでマージンの幅が変化する
いづれもOpera7.22で見ると、そのページのソース例ではバグは発現しませんでした。
607 ：くろさん：03/11/21 02:21 ID:uso8O1ae
CSSバグリスト（セルの内容物によって固定レイアウトが破壊される
http://cssbug.at.infoseek.co.jp/detail/opera/b065.html
）は、Opera7.22, Mozilla 1.5系でも発生します。
例えば、下記の例はIE6は正常で、Opera,Mozilla系はだめです。
http://selfhtml-jp.teamone.de/css/eigenschaften/tabellen.htm#table_layout
--
これとは逆に、fixed状態でセル幅をしていていても、ウィンドウ幅を縮めるとセル幅も狭くなってしまいます。
この現象も、Opera,Mozでのみ発生です。
これは、既知のバグでしょうか？
http://cssbug.at.infoseek.co.jp/detail/opera/b065.html
）は、Opera7.22, Mozilla 1.5系でも発生します。
例えば、下記の例はIE6は正常で、Opera,Mozilla系はだめです。
http://selfhtml-jp.teamone.de/css/eigenschaften/tabellen.htm#table_layout
--
これとは逆に、fixed状態でセル幅をしていていても、ウィンドウ幅を縮めるとセル幅も狭くなってしまいます。
この現象も、Opera,Mozでのみ発生です。
これは、既知のバグでしょうか？
608 ：Name_Not_Found：03/11/21 21:58 ID:???
CSS仕様では
fixedにするためには
col（またはセル）だけでなくtableのwidth指定が必須。
fixedにするためには
col（またはセル）だけでなくtableのwidth指定が必須。
609 ：Name_Not_Found：03/11/23 17:33 ID:???
【WinIE5.5〜6】
文字を打つとビロンと伸びるフォームアイテム
http://www.remus.dti.ne.jp/~a-satomi/nikki/2003/11b.html#d20n04s01
文字を打つとビロンと伸びるフォームアイテム
http://www.remus.dti.ne.jp/~a-satomi/nikki/2003/11b.html#d20n04s01
610 ：Name_Not_Found：03/11/23 18:52 ID:zULC30g6
テーブル幅を固定するには「table-layout=fixed & widht= NOT auto」こと、教えていただきありがとうございました。
さて、moz, operaでは、colへの属性指定は、tdに伝わらないのでしょうか？
IE6だと、２つ目のabcdefは赤色になるのですけどね。
またまた、moz,operaの方が｢正しいCSS」なのでしょうか。
<html>
<head>
<style type="text/css">
body { font-size: 12px;}
col.change { color : red; }
</style>
</head>
<body>
<table border="1">
<col></col>
<col class="change"></col>
<tr><td>ABCDEFG<td>abcdefg
</table>
</body>
</html>
さて、moz, operaでは、colへの属性指定は、tdに伝わらないのでしょうか？
IE6だと、２つ目のabcdefは赤色になるのですけどね。
またまた、moz,operaの方が｢正しいCSS」なのでしょうか。
<html>
<head>
<style type="text/css">
body { font-size: 12px;}
col.change { color : red; }
</style>
</head>
<body>
<table border="1">
<col></col>
<col class="change"></col>
<tr><td>ABCDEFG<td>abcdefg
</table>
</body>
</html>
611 ：すみません：03/11/23 18:54 ID:zULC30g6
直前の質問をしたものですが、質問スレは他にありましたので、そちらにカキコします。
すみませんでした。
すみませんでした。
612 ：Name_Not_Found：03/11/23 23:56 ID:???
前366さん、更新お疲れさま。
相対配置要素内のテーブル行グループ要素のスタイルが外部にはみ出す(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b131.html
↑これ、スクリーン・ショットがNetscape7.1とWinIE6.0とが逆ではないかしらん。
それと、>>546-548は結局Operaのバグではなかったんですかね？
相対配置要素内のテーブル行グループ要素のスタイルが外部にはみ出す(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b131.html
↑これ、スクリーン・ショットがNetscape7.1とWinIE6.0とが逆ではないかしらん。
それと、>>546-548は結局Operaのバグではなかったんですかね？
613 ：Name_Not_Found：03/11/24 00:15 ID:???
未確認バグ
visibilityを使用してもテーブルの一部が非表示にならない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b129.html
下記で確認できます。
http://csx.jp/~bookish/test1.htm
元は http://pc2.2ch.net/test/read.cgi/hp/1068535773/593 で
提出されたもの。
visibilityを使用してもテーブルの一部が非表示にならない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b129.html
下記で確認できます。
http://csx.jp/~bookish/test1.htm
元は http://pc2.2ch.net/test/read.cgi/hp/1068535773/593 で
提出されたもの。
614 ：Name_Not_Found：03/11/24 01:25 ID:???
news.html
style.css
blogbody.css
title.css
blogarticle.css
linkbar.css
banner.css
みたいに細切れのシートを、@import文を使いまくってページを制作しています。
（インデントは、ツリー条の構造をしている、親子関係を表しています）
WinXPのOpera7.20、Opera7.22で確認しましたが
@importで読み込んだシートのスタイルは処理するのですが、rootのシートである
style.cssに書き足したデザインを処理してくれません。
(@import url("");でも@import "";でも症状は変わらないようです)
困ったので、試しにテストページを作ったのですが
こちらは正常に表示されます
http://www.geocities.co.jp/Playtown-Knight/9224/import_test.html
あとF5でリロードすると、全部処理して意図したとおりに表示されてくれます。
HDD内でテスト表示させた場合にも正常に表示されています。
処理に関しては:before,:afterセレクタが付いたモノに関しては、例外的で処理を行ってくれています
と言う状況で、正直、"この時は処理しない"という規則が見えないで困っていたりします
同じ物を、再現できなかったので、不具合の起こったシートを用意できなくてすいませんが
何方か、似たような不具合が起こった方は、ご意見を頂けるとありがたいです
style.css
blogbody.css
title.css
blogarticle.css
linkbar.css
banner.css
みたいに細切れのシートを、@import文を使いまくってページを制作しています。
（インデントは、ツリー条の構造をしている、親子関係を表しています）
WinXPのOpera7.20、Opera7.22で確認しましたが
@importで読み込んだシートのスタイルは処理するのですが、rootのシートである
style.cssに書き足したデザインを処理してくれません。
(@import url("");でも@import "";でも症状は変わらないようです)
困ったので、試しにテストページを作ったのですが
こちらは正常に表示されます
http://www.geocities.co.jp/Playtown-Knight/9224/import_test.html
あとF5でリロードすると、全部処理して意図したとおりに表示されてくれます。
HDD内でテスト表示させた場合にも正常に表示されています。
処理に関しては:before,:afterセレクタが付いたモノに関しては、例外的で処理を行ってくれています
と言う状況で、正直、"この時は処理しない"という規則が見えないで困っていたりします
同じ物を、再現できなかったので、不具合の起こったシートを用意できなくてすいませんが
何方か、似たような不具合が起こった方は、ご意見を頂けるとありがたいです
615 ：Name_Not_Found：03/11/24 01:26 ID:???
news.html
style.css
blogbody.css
title.css
blogarticle.css
linkbar.css
banner.css
みたいに細切れのシートを、@import文を使いまくってページを制作しています。
（インデントは、ツリー条の構造をしている、親子関係を表しています）
WinXPのOpera7.20、Opera7.22で確認しましたが
@importで読み込んだシートのスタイルは処理するのですが、rootのシートである
style.cssに書き足したデザインを処理してくれません。
(@import url("");でも@import "";でも症状は変わらないようです)
困ったので、試しにテストページを作ったのですが
こちらは正常に表示されます
http://www.geocities.co.jp/Playtown-Knight/9224/import_test.html
あとF5でリロードすると、全部処理して意図したとおりに表示されてくれます。
HDD内でテスト表示させた場合にも正常に表示されています。
処理に関しては:before,:afterセレクタが付いたモノに関しては、例外的で処理を行ってくれています
と言う状況で、正直、"この時は処理しない"という規則が見えないで困っていたりします
同じ物を、再現できなかったので、不具合の起こったシートを用意できなくてすいませんが
何方か、似たような不具合が起こった方は、ご意見を頂けるとありがたいです
style.css
blogbody.css
title.css
blogarticle.css
linkbar.css
banner.css
みたいに細切れのシートを、@import文を使いまくってページを制作しています。
（インデントは、ツリー条の構造をしている、親子関係を表しています）
WinXPのOpera7.20、Opera7.22で確認しましたが
@importで読み込んだシートのスタイルは処理するのですが、rootのシートである
style.cssに書き足したデザインを処理してくれません。
(@import url("");でも@import "";でも症状は変わらないようです)
困ったので、試しにテストページを作ったのですが
こちらは正常に表示されます
http://www.geocities.co.jp/Playtown-Knight/9224/import_test.html
あとF5でリロードすると、全部処理して意図したとおりに表示されてくれます。
HDD内でテスト表示させた場合にも正常に表示されています。
処理に関しては:before,:afterセレクタが付いたモノに関しては、例外的で処理を行ってくれています
と言う状況で、正直、"この時は処理しない"という規則が見えないで困っていたりします
同じ物を、再現できなかったので、不具合の起こったシートを用意できなくてすいませんが
何方か、似たような不具合が起こった方は、ご意見を頂けるとありがたいです
616 ：Name_Not_Found：03/11/24 01:38 ID:???
２重投稿スイマセン…
投稿したときに、インデントが消えてしまったので罫線を付けさせて頂きます。
news.html
└style.css
├blogbody.css
│├title.css
│└blogarticle.css
└linkbar.css
└banner.css
投稿したときに、インデントが消えてしまったので罫線を付けさせて頂きます。
news.html
└style.css
├blogbody.css
│├title.css
│└blogarticle.css
└linkbar.css
└banner.css
617 ：Name_Not_Found：03/11/24 01:42 ID:???
スペースでも消えてしまいますね…
・news.html
・└style.css
・├blogbody.css
・│├title.css
・│└blogarticle.css
・└linkbar.css
・└banner.css
・news.html
・└style.css
・├blogbody.css
・│├title.css
・│└blogarticle.css
・└linkbar.css
・└banner.css
618 ：Name_Not_Found：03/11/24 01:44 ID:???
>>615
その症状が再現できるcssの中身を晒してもらわないとわかりません。
その症状が再現できるcssの中身を晒してもらわないとわかりません。
619 ：Name_Not_Found：03/11/24 02:01 ID:???
>>614-618
ﾜﾗﾀ
ﾜﾗﾀ
板汚しになってしまいましたね…、すいません
ちょっと時間かかってしまいましたが、テストケースを作りました
http://www.geocities.co.jp/Playtown-Knight/9224/
一応、自分環境のWinXP、Opera7.22では不具合を確認しています。
http://www.geocities.co.jp/Playtown-Knight/9224/preview.jpg
一応先ほど言いましたがF5リロードすると意図通りに表示されます
:before, afterの付いた物は何故か処理されます（このテストの中には入っていませんが…）
ちょっと時間かかってしまいましたが、テストケースを作りました
http://www.geocities.co.jp/Playtown-Knight/9224/
一応、自分環境のWinXP、Opera7.22では不具合を確認しています。
http://www.geocities.co.jp/Playtown-Knight/9224/preview.jpg
一応先ほど言いましたがF5リロードすると意図通りに表示されます
:before, afterの付いた物は何故か処理されます（このテストの中には入っていませんが…）
621 ：Name_Not_Found：03/11/24 06:03 ID:???
622 ：Name_Not_Found：03/11/24 06:12 ID:???
>>620
Opera7.20で再現でけたよ。気まぐれだなOpera
Opera7.20で再現でけたよ。気まぐれだなOpera
えっと、訂正です。
私の場合、オンラインで見てるときは問題ないのですが、
回線切って、オフラインで履歴を見ると、確かに再現されました。
……なんなんだろう？
私の場合、オンラインで見てるときは問題ないのですが、
回線切って、オフラインで履歴を見ると、確かに再現されました。
……なんなんだろう？
top_plus.cssとか見てみたけど。
bodyのひとつめでpaddingを0に指定して、
そのすぐ後でpadding-leftに値を持たせている、
その評価のタイミング
div#menu_boxでtopとleftを使っているのに
position指定がない
とか、不安定なCSSだな、とは思ったけど。
そのあたりが関係ありそうな気はする。
bodyのひとつめでpaddingを0に指定して、
そのすぐ後でpadding-leftに値を持たせている、
その評価のタイミング
div#menu_boxでtopとleftを使っているのに
position指定がない
とか、不安定なCSSだな、とは思ったけど。
そのあたりが関係ありそうな気はする。
てすとけーすその２です
:before 属性は動いています…と言う感じで…（汗。
http://www.geocities.co.jp/Playtown-Knight/9224/link.html
ルートにあたるlink.cssの
h2:before {}やli:before, dt:before {}は正常に動いているのですが
dl, ul {}やa {}の部分が動かない状態です。
不具合表示状態
http://www.geocities.co.jp/Playtown-Knight/9224/preview2.jpg
リロード後
http://www.geocities.co.jp/Playtown-Knight/9224/preview3..jpg
:before 属性は動いています…と言う感じで…（汗。
http://www.geocities.co.jp/Playtown-Knight/9224/link.html
ルートにあたるlink.cssの
h2:before {}やli:before, dt:before {}は正常に動いているのですが
dl, ul {}やa {}の部分が動かない状態です。
不具合表示状態
http://www.geocities.co.jp/Playtown-Knight/9224/preview2.jpg
リロード後
http://www.geocities.co.jp/Playtown-Knight/9224/preview3..jpg
626 ：Name_Not_Found：03/11/24 20:05 ID:???
>>625
「動いている」って何だよ。馬鹿っぽいぞ。
「動いている」って何だよ。馬鹿っぽいぞ。
>>625
624はスルー？ まあいいけど。
ざっと見て、例えば、html_default.css の35行目と記述がぶつかってるよ。
他にもいろいろ……
link.htm と link.css の dl に class や id を持たせたほうがいい。
それでも再現されたら、バグかもしれない。
とにかく、不具合とか騒ぐ前に、正しい CSS を書いてるかどうかチェックしたほうがいい。
不正な CSS に基づいて、ブラウザが不審な表示をしても、ブラウザに罪はないよ。
624はスルー？ まあいいけど。
ざっと見て、例えば、html_default.css の35行目と記述がぶつかってるよ。
他にもいろいろ……
link.htm と link.css の dl に class や id を持たせたほうがいい。
それでも再現されたら、バグかもしれない。
とにかく、不具合とか騒ぐ前に、正しい CSS を書いてるかどうかチェックしたほうがいい。
不正な CSS に基づいて、ブラウザが不審な表示をしても、ブラウザに罪はないよ。
628 ：Name_Not_Found：03/11/24 23:34 ID:???
せめてvailder通してから持ってきてくれ
629 ：Name_Not_Found：03/11/25 00:18 ID:???
vailderたん(´Д`)ﾊｧﾊｧ
630 ：Name_Not_Found：03/11/25 00:24 ID:???
全言語のページからvailderを検索しました。
約26件中1 - 21件目 ・検索にかかった時間0.18秒
約26件中1 - 21件目 ・検索にかかった時間0.18秒
631 ：Name_Not_Found：03/11/25 11:29 ID:???
W3C CSS 検証サービス http://jigsaw.w3.org/css-validator/
632 ：Name_Not_Found：03/11/25 12:10 ID:???
日本語validatorｷﾎﾞﾝﾇ
633 ：Name_Not_Found：03/11/25 20:56 ID:???
どうも、お返事遅れてスイマセン
>621
>bodyのひとつめでpaddingを0に指定して、
>そのすぐ後でpadding-leftに値を持たせている、
>その評価のタイミング
>div#menu_boxでtopとleftを使っているのに
>position指定がない
テストケース２
一応、menu_boxのposition:absolute;方は
class="link_bar" id="menu_box"
の方のlink_barクラスの方にあててあります(link_bar.cssから読み込んでいるside_bar.css内)
ただ、確かにどちらも誤動作の原因になりかねませんね
paddingの書き方に関しては以後２度と致しません
positionの方は、併用して上手くいくように、少し知恵を絞ってきます。
>624
自分のシートをvailderに掛けたところ、「あ」という感じで
数カ所ミスが見つかりました
修正して…、少しシートの方も煩雑なのでまとめ直して…、それでも症状が出るかテストして
後日書き直させて頂きます
お手間をおかけいたしました。
>621
>bodyのひとつめでpaddingを0に指定して、
>そのすぐ後でpadding-leftに値を持たせている、
>その評価のタイミング
>div#menu_boxでtopとleftを使っているのに
>position指定がない
テストケース２
一応、menu_boxのposition:absolute;方は
class="link_bar" id="menu_box"
の方のlink_barクラスの方にあててあります(link_bar.cssから読み込んでいるside_bar.css内)
ただ、確かにどちらも誤動作の原因になりかねませんね
paddingの書き方に関しては以後２度と致しません
positionの方は、併用して上手くいくように、少し知恵を絞ってきます。
>624
自分のシートをvailderに掛けたところ、「あ」という感じで
数カ所ミスが見つかりました
修正して…、少しシートの方も煩雑なのでまとめ直して…、それでも症状が出るかテストして
後日書き直させて頂きます
お手間をおかけいたしました。
636 ：Name_Not_Found：03/11/26 23:31 ID:???
IE6ですが、
<div style="margin-left: 5em; border: 1px solid">
<p style="margin-left: -5em; width: 5em">テスト</p>
</div>
<p>テスト</p>
上記は 5em マージンの中に -5em マージンがあるので、元の
位置に戻って2つのp要素は揃うはずですが、揃いません。
発生条件は、
・外側の要素に border がある。
・内側の要素に width を指定。
・内側の要素にマイナスのマージン
という条件が重なった場合に、その内側のマージンが無視される
ようです。
<div style="margin-left: 5em; border: 1px solid">
<p style="margin-left: -5em; width: 5em">テスト</p>
</div>
<p>テスト</p>
上記は 5em マージンの中に -5em マージンがあるので、元の
位置に戻って2つのp要素は揃うはずですが、揃いません。
発生条件は、
・外側の要素に border がある。
・内側の要素に width を指定。
・内側の要素にマイナスのマージン
という条件が重なった場合に、その内側のマージンが無視される
ようです。
>>636 はIE6標準モードだけで発生します。互換モードや
IE5.5では起こりません。
IE5.5では起こりません。
638 ：528：03/11/28 19:30 ID:j3Mv4gjv
safari
link要素にtype属性を指定した上で外部CSSを読み込んだ場合、
先頭に記述したlink要素を固定スタイルシートとして認識する。
<link rel="ALTERNATE STYLESHEET" type="text/css" href="daitai.css" title="代替スタイル">
<link rel="STYLESHEET" type="text/css" href="kotei.css">
とすると、kotei.cssとdaitai.cssの両方が読み込まれる。
<link rel="ALTERNATE STYLESHEET" type="text/css" href="daitai.css" title="代替スタイル">
<link rel="STYLESHEET" type="text/css" href="yusen.css" title="優先スタイル">
とすると、daitai.cssのみが読み込まれる。
不適切だったり、記述に不備があれば申し訳ない。
link要素にtype属性を指定した上で外部CSSを読み込んだ場合、
先頭に記述したlink要素を固定スタイルシートとして認識する。
<link rel="ALTERNATE STYLESHEET" type="text/css" href="daitai.css" title="代替スタイル">
<link rel="STYLESHEET" type="text/css" href="kotei.css">
とすると、kotei.cssとdaitai.cssの両方が読み込まれる。
<link rel="ALTERNATE STYLESHEET" type="text/css" href="daitai.css" title="代替スタイル">
<link rel="STYLESHEET" type="text/css" href="yusen.css" title="優先スタイル">
とすると、daitai.cssのみが読み込まれる。
不適切だったり、記述に不備があれば申し訳ない。
639 ：Name_Not_Found：03/11/28 19:54 ID:???
640 ：528：03/11/29 00:58 ID:Thko+n23
641 ：Name_Not_Found：03/11/29 13:31 ID:???
>>640
>528のときもそうだったが、最低限再現する状況と
それがW3Cの勧告と異なっているのか(本当にバグなのか)
調べてから書けよ。
んなこと当たり前なんだが、「バグを見つけた」と騒ぎたい
だけの厨なのか？
>528のときもそうだったが、最低限再現する状況と
それがW3Cの勧告と異なっているのか(本当にバグなのか)
調べてから書けよ。
んなこと当たり前なんだが、「バグを見つけた」と騒ぎたい
だけの厨なのか？
642 ：528：03/11/29 18:59 ID:Thko+n23
Safari(v85.6 OS10.2)については、
「代替スタイルシートを、優先・固定スタイルより先に記すと、
代替が固定として認識されることが<strong>ありうる</strong>」
でした。
代替の後ろに記述するのが優先なら確率1/2くらい、固定なら1/3~5くらい。
同じソースをリロードする度に、表示が変わるけど、法則と原因は不明。
昨日はtype属性を消してみたり、記述順を変えたり、いろいろな条件を試していて、
偶然、type属性を記述した時にのみ、症状が出ていた様子。
このスレをまとめたサイトを活用させてもらってるので、
自分が見つけた時は、他の人の為に報告しようと思っただけ。
別に他に同様の症状が出てる人がいなければ、それでいいし、
いるなら、役立ててくださいってだけ。
ちなみに、528はバグだと思って書き込んで、
「バグじゃねー」と言われて、勧告を狭義に読み直して、
「んじゃ、バグじゃねーってことでいいよ」と考えを変えて、
541見て、もいちどちゃんと読んで、結局、個人的にはバグだと今でも思ってる。
528や今回のを、報告・掲載する必要があるかどうかについては、
このスレ、この板の住人じゃないというか、
そもそも2chに常駐すらしていないので分からない。
住人しか書き込むなと言うなら、そうします。
OS,UAのバージョンを書いてないのと、再現する状況のテスト不足、
W3C勧告の理解不足についてはすなおに、ゴメンなさい。
「代替スタイルシートを、優先・固定スタイルより先に記すと、
代替が固定として認識されることが<strong>ありうる</strong>」
でした。
代替の後ろに記述するのが優先なら確率1/2くらい、固定なら1/3~5くらい。
同じソースをリロードする度に、表示が変わるけど、法則と原因は不明。
昨日はtype属性を消してみたり、記述順を変えたり、いろいろな条件を試していて、
偶然、type属性を記述した時にのみ、症状が出ていた様子。
このスレをまとめたサイトを活用させてもらってるので、
自分が見つけた時は、他の人の為に報告しようと思っただけ。
別に他に同様の症状が出てる人がいなければ、それでいいし、
いるなら、役立ててくださいってだけ。
ちなみに、528はバグだと思って書き込んで、
「バグじゃねー」と言われて、勧告を狭義に読み直して、
「んじゃ、バグじゃねーってことでいいよ」と考えを変えて、
541見て、もいちどちゃんと読んで、結局、個人的にはバグだと今でも思ってる。
528や今回のを、報告・掲載する必要があるかどうかについては、
このスレ、この板の住人じゃないというか、
そもそも2chに常駐すらしていないので分からない。
住人しか書き込むなと言うなら、そうします。
OS,UAのバージョンを書いてないのと、再現する状況のテスト不足、
W3C勧告の理解不足についてはすなおに、ゴメンなさい。
643 ：Name_Not_Found：03/11/29 19:42 ID:???
擬似クラスにスタイル指定がないと擬似クラスの子孫要素への指定が効かない(IE6)
http://cssbug.at.infoseek.co.jp/detail/winie/b077.html
＞a:hover自体にもスタイルを指定するとこのバグを回避できます。
スタイルでなくても、何か書き込めばバグ回避できました。
a:hover {123}とか、適当に。空白文字は駄目ですが。
ところで、トップ・ページのリンク、
http://cssbug.at.infoseek.co.jp/index.html
/* CSS・スタイルシート質問スレッド【24】 */ はもう25ですよ。
http://cssbug.at.infoseek.co.jp/detail/winie/b077.html
＞a:hover自体にもスタイルを指定するとこのバグを回避できます。
スタイルでなくても、何か書き込めばバグ回避できました。
a:hover {123}とか、適当に。空白文字は駄目ですが。
ところで、トップ・ページのリンク、
http://cssbug.at.infoseek.co.jp/index.html
/* CSS・スタイルシート質問スレッド【24】 */ はもう25ですよ。
644 ：Name_Not_Found：03/11/29 19:45 ID:???
>>642
その>>528はバグ登録されたよ。
rel="alternate stylesheet" でなければ代替スタイルシートにならない(7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b069.html
その>>528はバグ登録されたよ。
rel="alternate stylesheet" でなければ代替スタイルシートにならない(7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b069.html
645 ：Name_Not_Found：03/11/29 21:07 ID:???
WinIE6で、
floatプロパディが指定された要素のmarginを指定すると倍の値が適用されちゃうのは既出っすか？
floatプロパディが指定された要素のmarginを指定すると倍の値が適用されちゃうのは既出っすか？
646 ：Name_Not_Found：03/11/29 21:18 ID:???
647 ：Name_Not_Found：03/11/30 01:34 ID:???
奇妙な現象。Win98SE/IE6にて。
文字サイズを「中」以外で閲覧中、下記ページへ移動する。
OpenTypeフォントを用いて2バイト文字を表示することができない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b122.html
すると強制的に文字サイズが「中」で表示されてしまふ。
事例の日本語文字列も、ＭＳ（Ｐ）ゴシックで表示されてないやうだ。
何故？
文字サイズを「中」以外で閲覧中、下記ページへ移動する。
OpenTypeフォントを用いて2バイト文字を表示することができない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b122.html
すると強制的に文字サイズが「中」で表示されてしまふ。
事例の日本語文字列も、ＭＳ（Ｐ）ゴシックで表示されてないやうだ。
何故？
いや、どうも再現しない場合があるね。
以前に閲覧したときの文字サイズに強制的に変更するみたいでもある。
大で上記ＵＲＬを表示→別ページを表示→文字サイズ小にする→上記ＵＲＬを表示→
とすると、小にならず「大」になりました。
以前に閲覧したときの文字サイズに強制的に変更するみたいでもある。
大で上記ＵＲＬを表示→別ページを表示→文字サイズ小にする→上記ＵＲＬを表示→
とすると、小にならず「大」になりました。
649 ：Name_Not_Found：03/11/30 01:56 ID:GTC4QolK
Mozilla1.5 で relative なレイヤーの中に
absolute なレイヤーを作ると本文の背後に隠れてリンクが効かない。
これってバグでしょうか。
下記がサンプルです。
http://mar0.hp.infoseek.co.jp/test.html
absolute なレイヤーを作ると本文の背後に隠れてリンクが効かない。
これってバグでしょうか。
下記がサンプルです。
http://mar0.hp.infoseek.co.jp/test.html
650 ：Name_Not_Found：03/11/30 08:23 ID:???
651 ：649：03/11/30 13:17 ID:GTC4QolK
>>650 さん検証ありがとうございます。
でも、div でもダメっぽいです。
バージョンは Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.5) Gecko/20031007
div 版のサンプルはこちら
http://mar0.hp.infoseek.co.jp/test_div.html
でも、div でもダメっぽいです。
バージョンは Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.5) Gecko/20031007
div 版のサンプルはこちら
http://mar0.hp.infoseek.co.jp/test_div.html
2chは書き慣れていない物で、不手際が多かったですが
一応、validator通して、エラーが出る物を消してきました。
一応、症状に関しては、長文になるので、下のアドレスにupしておきました。
http://www.geocities.co.jp/Playtown-Knight/9224/test3/opera_report.html
正直、原因は良く分からなかったのですが…。
一応、validator通して、エラーが出る物を消してきました。
一応、症状に関しては、長文になるので、下のアドレスにupしておきました。
http://www.geocities.co.jp/Playtown-Knight/9224/test3/opera_report.html
正直、原因は良く分からなかったのですが…。
653 ：Name_Not_Found：03/12/01 01:29 ID:???
Mozilla 1.0.1 + Windows XP Home で、
・ULかOLかLIのリストマーカーに画像を指定する。
・LI要素の先頭にUL、OL以外のブロックレベル要素を含む。
・<li>タグの後に空白文字(改行/空白/タブ)を含む。
と、マーカーが消えてしまうことがありました。
それもローカルのファイルでなく、http://〜 のURLを表示したときのみ。
さらにアドレス欄にURLを打ち、Enterしたときは表示され、
リロードすると消えるなどはっきりしません。
<style type="text/css">
ul { list-style-image: url("marker.png"); }
</style>
:
<ul>
<li>
<div>空白文字 + ブロック → マーカーが消える</div></li>
<li><p>ブロックのみ → マーカー画像が表示される</p></li>
</ul>
・ULかOLかLIのリストマーカーに画像を指定する。
・LI要素の先頭にUL、OL以外のブロックレベル要素を含む。
・<li>タグの後に空白文字(改行/空白/タブ)を含む。
と、マーカーが消えてしまうことがありました。
それもローカルのファイルでなく、http://〜 のURLを表示したときのみ。
さらにアドレス欄にURLを打ち、Enterしたときは表示され、
リロードすると消えるなどはっきりしません。
<style type="text/css">
ul { list-style-image: url("marker.png"); }
</style>
:
<ul>
<li>
<div>空白文字 + ブロック → マーカーが消える</div></li>
<li><p>ブロックのみ → マーカー画像が表示される</p></li>
</ul>
すんません書き忘れ。条件の、
> LI要素の先頭に"UL、OL以外"のブロックレベル要素を含む
ってのは全部調べたわけじゃないです。
UL,OL,P,DIV,DL,TABLE,Hn くらい見たかｎ
> LI要素の先頭に"UL、OL以外"のブロックレベル要素を含む
ってのは全部調べたわけじゃないです。
UL,OL,P,DIV,DL,TABLE,Hn くらい見たかｎ
655 ：Name_Not_Found：03/12/01 05:26 ID:???
656 ：Name_Not_Found：03/12/01 08:31 ID:Mc1e8qus
>>655
( ´,_ゝ｀)ﾌﾟｯ
( ´,_ゝ｀)ﾌﾟｯ
657 ：Name_Not_Found：03/12/03 12:37 ID:???
word-breakがブロックレベル要素以外で効かない(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b128.html
これはバグってよりもIEの「仕樣」では？ どうせ先取り実装なんだし。
http://cssbug.at.infoseek.co.jp/detail/winie/b128.html
これはバグってよりもIEの「仕樣」では？ どうせ先取り実装なんだし。
658 ：Name_Not_Found：03/12/03 22:47 ID:???
http://pc2.2ch.net/test/read.cgi/hp/1069216458/547-549
フォント指定で、英語フォントと日本語フォントを重複して使用すると
MacIEでtextareaが文字化けする（らしい）。
フォント指定で、英語フォントと日本語フォントを重複して使用すると
MacIEでtextareaが文字化けする（らしい）。
659 ：sage：03/12/04 00:11 ID:XdSini6M
tr{
background: transparent url('sage.png') center right repeat-x;
}
のような指定をしても Opera6, 7 両方で repeat-x が無視されて
背景画像が全面に敷き詰められる。
background: transparent url('sage.png') center right repeat-x;
}
のような指定をしても Opera6, 7 両方で repeat-x が無視されて
背景画像が全面に敷き詰められる。
660 ：Name_Not_Found：03/12/08 11:22 ID:TunXwEpJ
ちょっと確認なんですが、Mac-IEでは @media ブロック内の「全ての」宣言が無視される
ってので合ってるんでしょうか？（インデントのための全角スペースはご容赦）
@media screen {
H1 { color: #FF0000 }
H2 { color: #FFFF00 }
H3 { color: #00FF00 }
H4 { color: #00FFFF }
H5 { color: #0000FF }
H6 { color: #FF00FF }
}
上の例でH1〜H6まで全部無視されるということでOKですか？
ちなみにWin-IE4では（おそらくIE3も） @media を「セレクタ」とみなして
@media以降初めて } が出現するところまでが無視されるので
H1だけスタイルが適用されず、H2以降はスタイルが適用される
（媒体種は区別しない）わけですが、バグの性質が違うのかどうか確認したいのです。
ってので合ってるんでしょうか？（インデントのための全角スペースはご容赦）
@media screen {
H1 { color: #FF0000 }
H2 { color: #FFFF00 }
H3 { color: #00FF00 }
H4 { color: #00FFFF }
H5 { color: #0000FF }
H6 { color: #FF00FF }
}
上の例でH1〜H6まで全部無視されるということでOKですか？
ちなみにWin-IE4では（おそらくIE3も） @media を「セレクタ」とみなして
@media以降初めて } が出現するところまでが無視されるので
H1だけスタイルが適用されず、H2以降はスタイルが適用される
（媒体種は区別しない）わけですが、バグの性質が違うのかどうか確認したいのです。
661 ：Name_Not_Found：03/12/08 21:19 ID:???
> 上の例でH1〜H6まで全部無視されるということでOKですか？
その通りです。括弧の対応をチェックしているみたいですね。
その通りです。括弧の対応をチェックしているみたいですね。
662 ：Name_Not_Found：03/12/08 22:09 ID:???
IE6ですが、
div { padding: 0 20% }
a:hover { background: #fcc }
<div>
<p><a href="xx.html">テスト</a></p>
</div>
このように、パーセントのpaddingを指定した中に背景色を
指定したA:hoverを書くと、リンクにマウスポインタを乗せた
時に文字がずれます。
div { padding: 0 20% }
a:hover { background: #fcc }
<div>
<p><a href="xx.html">テスト</a></p>
</div>
このように、パーセントのpaddingを指定した中に背景色を
指定したA:hoverを書くと、リンクにマウスポインタを乗せた
時に文字がずれます。
663 ：Name_Not_Found：03/12/09 08:03 ID:???
<script type="text/javascript">
onload=function(){alert(document.getElementById("ta").value);}
</script>
<textarea id="ta" style="display:none;">hogehoge</textarea>
IE、Mozillaだと"hogehoge"が表示されますがOperaだと"Warning"という謎の文字列が表示されます。
エラー、例外などは発生しません。
onload=function(){alert(document.getElementById("ta").value);}
</script>
<textarea id="ta" style="display:none;">hogehoge</textarea>
IE、Mozillaだと"hogehoge"が表示されますがOperaだと"Warning"という謎の文字列が表示されます。
エラー、例外などは発生しません。
664 ：Name_Not_Found：03/12/09 09:38 ID:???
665 ：Name_Not_Found：03/12/09 12:03 ID:???
666 ：Name_Not_Found：03/12/11 14:32 ID:qnEJrBaP
CSSとはあんまり関係ないっぽいけどマックのIE5で
<td align="right"><a href="hoge.html">hoge</a></td>
とか、
<div align="right"><a href="hoge.html">hoge</a></div>
としたときにtdやdivのエリアのなかでhogeのリンクの位置はたしかに右寄せになるんだけど
align="right"がついてないときに表示されたであろう場所あたりで
カーソルが指になって何も見えてないところがリンクされてしまう、
というバグは既出でしょうか？バグ辞典サイトにも出てないみたいだけど。
web creators誌2002/8/p42にも出てるんだけどtdの場合は
もう一つtdを99%で作って回避できるんだけどDIVの場合どうやって回避したら
いいんでしょうか？
<td align="right"><a href="hoge.html">hoge</a></td>
とか、
<div align="right"><a href="hoge.html">hoge</a></div>
としたときにtdやdivのエリアのなかでhogeのリンクの位置はたしかに右寄せになるんだけど
align="right"がついてないときに表示されたであろう場所あたりで
カーソルが指になって何も見えてないところがリンクされてしまう、
というバグは既出でしょうか？バグ辞典サイトにも出てないみたいだけど。
web creators誌2002/8/p42にも出てるんだけどtdの場合は
もう一つtdを99%で作って回避できるんだけどDIVの場合どうやって回避したら
いいんでしょうか？
667 ：Name_Not_Found：03/12/11 15:04 ID:???
text-alignにしなさい。>>666
668 ：Name_Not_Found：03/12/11 15:22 ID:qnEJrBaP
666です。>>667
text-alignでも同じですがなにか？
結局テーブルにするしかないのか？
tdなら
<td width="99%"></td>
<td width="1%" nowrap="nowrap"><a href="hoge.html">hoge</a></td>
で逃げられるんだけど。
text-alignでも同じですがなにか？
結局テーブルにするしかないのか？
tdなら
<td width="99%"></td>
<td width="1%" nowrap="nowrap"><a href="hoge.html">hoge</a></td>
で逃げられるんだけど。
669 ：Name_Not_Found：03/12/11 15:36 ID:???
ブラウザのバージョンは
IE6.02
Moz1.5b
Opera7.11build2887
(すべてWinXP)
です
IE6.02
Moz1.5b
Opera7.11build2887
(すべてWinXP)
です
671 ：Name_Not_Found：03/12/11 15:49 ID:???
すみません
670は663の間違いです
670は663の間違いです
673 ：Name_Not_Found：03/12/11 17:35 ID:qnEJrBaP
>>666です。
>>669
たしかにその通りでございます。align="right"だとhtmlですね。
テキストのリンクをいくつか横並びで右つめにしたいわけなんですが
どんな風に書いたらいいんだろう？
もちろんそのリンクが並ぶ段にはいろいろとcssで装飾をしてます。
strictであることより崩れないことが第一な状況なんですが。
liをインラインで・・とか危なそうだ。結局テーブルが一番安全？
>>669
たしかにその通りでございます。align="right"だとhtmlですね。
テキストのリンクをいくつか横並びで右つめにしたいわけなんですが
どんな風に書いたらいいんだろう？
もちろんそのリンクが並ぶ段にはいろいろとcssで装飾をしてます。
strictであることより崩れないことが第一な状況なんですが。
liをインラインで・・とか危なそうだ。結局テーブルが一番安全？
674 ：Name_Not_Found：03/12/11 19:51 ID:???
675 ：Name_Not_Found：03/12/11 23:39 ID:???
前366さん曰く、
>>>546-548はOpera006（2003-11-07修正）に含めました。
http://cssbug.at.infoseek.co.jp/index.html
で、Opera006を見ますと――
http://cssbug.at.infoseek.co.jp/detail/opera/b006.html
「テーブルセル要素は常にhidden値であるものとして扱う」の所為なのかな。
ソース例が無いのでよくわからない……。
>>>546-548はOpera006（2003-11-07修正）に含めました。
http://cssbug.at.infoseek.co.jp/index.html
で、Opera006を見ますと――
http://cssbug.at.infoseek.co.jp/detail/opera/b006.html
「テーブルセル要素は常にhidden値であるものとして扱う」の所為なのかな。
ソース例が無いのでよくわからない……。
676 ：Name_Not_Found：03/12/12 00:03 ID:???
朗報。既出かな？
異なるバージョンのMicrosoft Internet Explorerを共存させてみる。
http://www.misuzilla.org/docs/ie-SxS
1つのWindowsに複数バージョンのIEを共存
http://altba.com/yuu/blog/archives/000351.html
異なるバージョンのIEを一つのWindowsにインストール
http://chitatopops.net/archives/2003/11/10/multiple_ies_in_windows.php
単一のWindowsに異なるバージョンのIEをインストールする方法
http://deztec.jp/design/03/12/000028.html
異なるバージョンのMicrosoft Internet Explorerを共存させてみる。
http://www.misuzilla.org/docs/ie-SxS
1つのWindowsに複数バージョンのIEを共存
http://altba.com/yuu/blog/archives/000351.html
異なるバージョンのIEを一つのWindowsにインストール
http://chitatopops.net/archives/2003/11/10/multiple_ies_in_windows.php
単一のWindowsに異なるバージョンのIEをインストールする方法
http://deztec.jp/design/03/12/000028.html
677 ：Name_Not_Found：03/12/12 01:20 ID:???
678 ：Name_Not_Found：03/12/12 01:52 ID:???
>676
感動した。明日にでも試してみる。
感動した。明日にでも試してみる。
679 ：Name_Not_Found：03/12/12 16:29 ID:???
先生教えてください！
WindowsXPのテキストボックスって
初期表示の状態でフラットな状態ですが
document.form1["hoge"].style.backgroundColor = '#eeeeee';
とすると、テキストボックスがへこんだ状態になってしまいます
これを回避する方法はありますか？
borderにsolidとすればへこみがなくなるのですが
今度はXP以外のOSでもへこみなしになってしまいます。
いずれの環境でも、backgroundColorを設定したあとでも
とある契機でデフォルトの状態に戻したいのですが無理ですか？
WindowsXPのテキストボックスって
初期表示の状態でフラットな状態ですが
document.form1["hoge"].style.backgroundColor = '#eeeeee';
とすると、テキストボックスがへこんだ状態になってしまいます
これを回避する方法はありますか？
borderにsolidとすればへこみがなくなるのですが
今度はXP以外のOSでもへこみなしになってしまいます。
いずれの環境でも、backgroundColorを設定したあとでも
とある契機でデフォルトの状態に戻したいのですが無理ですか？
680 ：Name_Not_Found：03/12/12 20:38 ID:???
へー、ってことはそれボタンにやったらトグルボタンになるってこと？
それいいなぁ。
それいいなぁ。
681 ：Name_Not_Found：03/12/12 21:16 ID:???
>679
システム色キーワードを使ってみたら？
テキストボックスのデフォルト背景色は…たぶん「Window」かな。
document.form1["hoge"].style.backgroundColor = 'Window';
とすればデフォルトの色になると思う。
ボーダーまで戻るかどうかは知らないけど。
ただCSSでデザインしてるなら、
OSによらず同じ（似たような）見た目にした方が良い気もしなくもない。
システム色キーワードを使ってみたら？
テキストボックスのデフォルト背景色は…たぶん「Window」かな。
document.form1["hoge"].style.backgroundColor = 'Window';
とすればデフォルトの色になると思う。
ボーダーまで戻るかどうかは知らないけど。
ただCSSでデザインしてるなら、
OSによらず同じ（似たような）見た目にした方が良い気もしなくもない。
682 ：Name_Not_Found：03/12/12 23:26 ID:???
普段使ってるインターフェイスに近い方が閲覧者に優しいかもよ
683 ：Name_Not_Found：03/12/13 00:19 ID:irkJn+d3
Mozilla Firebird 0.7 （Win/MacOSX）、DOCTYPE: HTML4.01 strict、
media: all で確認しました。
ブロック要素の first-letter 疑似クラスに font-size: 180%; float: left;
などと設定すると、英文によくある最初の文字だけ大きいレイアウトにできます
が、その状態で印刷を選ぶと、印刷結果では疑似クラスを設定したブロックの
2行目以降からそのページの終わりまでにあるブロックの左マージンが、疑似
クラスを設定したブロックの2文字目に揃った状態になります。
画面表示は大丈夫なので、みなさんあんまり興味ないでしょうか。
media: all で確認しました。
ブロック要素の first-letter 疑似クラスに font-size: 180%; float: left;
などと設定すると、英文によくある最初の文字だけ大きいレイアウトにできます
が、その状態で印刷を選ぶと、印刷結果では疑似クラスを設定したブロックの
2行目以降からそのページの終わりまでにあるブロックの左マージンが、疑似
クラスを設定したブロックの2文字目に揃った状態になります。
画面表示は大丈夫なので、みなさんあんまり興味ないでしょうか。
>>681-682
Window試しましたが、へこんだままでした。
社内システムで入力不可の項目に使ってるのですが
気にしないでもらうことにします。
ありがとうございました。
でもこれってXPのバグなのかなー？
Window試しましたが、へこんだままでした。
社内システムで入力不可の項目に使ってるのですが
気にしないでもらうことにします。
ありがとうございました。
でもこれってXPのバグなのかなー？
685 ：Name_Not_Found：03/12/13 01:03 ID:a6ACP15L
686 ：Name_Not_Found：03/12/13 10:31 ID:???
>>685
それだけだと見た目分かりにくいから色も変える
それだけだと見た目分かりにくいから色も変える
687 ：685：03/12/14 01:04 ID:JRqVLQ/X
688 ：Name_Not_Found：03/12/15 17:23 ID:???
>>687
<input type="text" style="background-color:#eeeeee;">
よくわかってないのですが
上の時点ですでにへこんでしまうようです
class属性値を帰るってのは別の意味ですか？
<input type="text" style="background-color:#eeeeee;">
よくわかってないのですが
上の時点ですでにへこんでしまうようです
class属性値を帰るってのは別の意味ですか？
689 ：Name_Not_Found：03/12/15 21:47 ID:sy8ZsWBK
たいしたことじゃないっすけど、
MacIE／バグ045：16進数エスケープ文字の直後に置いた空白類文字を無視しない
http://cssbug.at.infoseek.co.jp/detail/macie/b045.html
は、最新版の5.1.7(OS 9.1)と5.2.3(OS X)解消されてますた。
どこのバージョンで解消されたかは不明です。
MacIE／バグ045：16進数エスケープ文字の直後に置いた空白類文字を無視しない
http://cssbug.at.infoseek.co.jp/detail/macie/b045.html
は、最新版の5.1.7(OS 9.1)と5.2.3(OS X)解消されてますた。
どこのバージョンで解消されたかは不明です。
690 ：Name_Not_Found：03/12/15 21:52 ID:???
marqueeのタグの中でloop="∞"ってあったんですが、∞って2バイト文字じゃないんですか？
世界共通で有効に機能する要素なんでしょうか？？
世界共通で有効に機能する要素なんでしょうか？？
691 ：Name_Not_Found：03/12/15 22:00 ID:???
>>690
marqueeだと？ ＣＳＳと何の関係があるか。
marqueeだと？ ＣＳＳと何の関係があるか。
692 ：Name_Not_Found：03/12/17 15:46 ID:???
今は関係ないけどcss3でmarquee勧告されっかも。
IEの属性をそのままプロパティにしたような感じ。
WAP-CSSでは正式な規格として既にmarqueeあるね。
IEの属性をそのままプロパティにしたような感じ。
WAP-CSSでは正式な規格として既にmarqueeあるね。
で、仮に CSS3 で marquee が勧告されたとして、
それと謎 HTML の loop="∞" とどう関係があるの。
loop="∞" という記述が正しいか否かは HTML の仕様を
基準に判断すべき事であって、CSS の仕様は関係ない。
それと謎 HTML の loop="∞" とどう関係があるの。
loop="∞" という記述が正しいか否かは HTML の仕様を
基準に判断すべき事であって、CSS の仕様は関係ない。
694 ：Name_Not_Found：03/12/17 18:10 ID:???
>690のソースはどこよ
695 ：Name_Not_Found：03/12/17 18:37 ID:???
CSS/DHTMLバグ辞典スレッド 第３版
ＣＳＳ（とDHTML）のバグ報告、お待ちしてます。
ＣＳＳ（とDHTML）のバグ報告、お待ちしてます。
696 ：Name_Not_Found：03/12/19 03:28 ID:???
やっぱ ascii では loop="∞" なんだろうな。
697 ：Name_Not_Found：03/12/19 03:30 ID:???
ボタン押してから気付いたけど展開されるよな。
loop="∞"
loop="∞"
698 ：Name_Not_Found：03/12/19 09:55 ID:???
ISO 8859-1あたりにも∞があるんだろ。
JISにも定義されてるから日本語環境だと全角に見えると。
JISにも定義されてるから日本語環境だと全角に見えると。
699 ：Name_Not_Found：03/12/19 11:58 ID:???
WinIE6 で @i や @m や !i が無視されないで、
@import, @media, !important規則として機能する。
ttp://altba.com/bakera/hatomaru.aspx/ebi/2003/12/18/004d005300490045003600203082304699c476ee304b3082
ttp://altba.com/bakera/hatomaru.aspx/ebi/2003/12/15/004000690020306730a430f330dd30fc30c8
@import, @media, !important規則として機能する。
ttp://altba.com/bakera/hatomaru.aspx/ebi/2003/12/18/004d005300490045003600203082304699c476ee304b3082
ttp://altba.com/bakera/hatomaru.aspx/ebi/2003/12/15/004000690020306730a430f330dd30fc30c8
700 ：Name_Not_Found：03/12/20 02:17 ID:???
>>551
すさまじく今さらだけど、
http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
での対策以外にも、
a{display:block;}
<ul>
<li><a>hoge</a></li><li>
<a>foo</a></li></ul>
のように、</li>の後に空白や改行を入れないでソースを書けば回避できた。
他にも、liのスタイルにborderを指定してやれば回避できる模様。
(border-width:0;やborder-style:none;では駄目ぽい)
どちらもIE5.5、win2kで確認。既出だったらゴメン。
すさまじく今さらだけど、
http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
での対策以外にも、
a{display:block;}
<ul>
<li><a>hoge</a></li><li>
<a>foo</a></li></ul>
のように、</li>の後に空白や改行を入れないでソースを書けば回避できた。
他にも、liのスタイルにborderを指定してやれば回避できる模様。
(border-width:0;やborder-style:none;では駄目ぽい)
どちらもIE5.5、win2kで確認。既出だったらゴメン。
701 ：Name_Not_Found：03/12/20 03:13 ID:???
Opera7.23 日本語版
li の中身がリンクのみの場合、指定した line-height にならない。
例えばスタイルシートが
* { line-height: 1em; }
li { line-height: 1.5em; }
で
次のような記述
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
があった場合 aaa と bbb，bbb と ccc の間は 0.5em 分の行間が空きます（当たり前ですが）
ところが
<ul>
<li><a href="aaa.html">aaa</a></li>
<li><a href="bbb.html">bbb</a></li>
<li><a href="ccc.html">ccc</a></li>
</ul>
のように li の中身がリンクのみの場合、行間が空きません。詰まって表示されます。
ちなみに
<ul>
<li>1.<a href="aaa.html">aaa</a></li>
<li>2.<a href="bbb.html">bbb</a></li>
<li>3.<a href="ccc.html">ccc</a></li>
</ul>
のように li の中身にリンク以外の文字が含まれている場合は、きちんと行間が空きます。
うちはWindowsMEなんですけど、他の方の環境でも再現しますでしょうか？
li の中身がリンクのみの場合、指定した line-height にならない。
例えばスタイルシートが
* { line-height: 1em; }
li { line-height: 1.5em; }
で
次のような記述
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
があった場合 aaa と bbb，bbb と ccc の間は 0.5em 分の行間が空きます（当たり前ですが）
ところが
<ul>
<li><a href="aaa.html">aaa</a></li>
<li><a href="bbb.html">bbb</a></li>
<li><a href="ccc.html">ccc</a></li>
</ul>
のように li の中身がリンクのみの場合、行間が空きません。詰まって表示されます。
ちなみに
<ul>
<li>1.<a href="aaa.html">aaa</a></li>
<li>2.<a href="bbb.html">bbb</a></li>
<li>3.<a href="ccc.html">ccc</a></li>
</ul>
のように li の中身にリンク以外の文字が含まれている場合は、きちんと行間が空きます。
うちはWindowsMEなんですけど、他の方の環境でも再現しますでしょうか？
702 ：Name_Not_Found：03/12/20 03:36 ID:???
>>700
そのバグって</li>タグを記述して要素の終端を明示しても、
内部的には</li>タグを省略した場合と同等に扱われるという
何とも納得のいかないトンデモ実装。実はdt要素でも発生します。
その他にも、要素間の空白ノードを勝手に取り除いたりもします。
つまりオブジェクトツリーを生成する段階でイレギュラーであると。
Microsoft は DOM1 を実装していると謳っているけれど、
実はMSIE4時代のDHTML機能をDOM風に偽装しているだけであると。
getElementsByTagName('!') でコメントを要素集合に含めてしまうし、
getAttribute() とかは、単にプロパティを肩代わりしているだけだし、
base要素は空要素のはずなのに、後続要素を包含してしまったりするし。
DOM はプラットフォーム中立・言語中立のインターフェイスのはずなのに、
MSIE の所為で、旧来のDHTML同様に余計な分岐処理を強いることになる。
CSS2 の実装も遅れてるし、MS はウェブの発展を著しく阻害している。
そのバグって</li>タグを記述して要素の終端を明示しても、
内部的には</li>タグを省略した場合と同等に扱われるという
何とも納得のいかないトンデモ実装。実はdt要素でも発生します。
その他にも、要素間の空白ノードを勝手に取り除いたりもします。
つまりオブジェクトツリーを生成する段階でイレギュラーであると。
Microsoft は DOM1 を実装していると謳っているけれど、
実はMSIE4時代のDHTML機能をDOM風に偽装しているだけであると。
getElementsByTagName('!') でコメントを要素集合に含めてしまうし、
getAttribute() とかは、単にプロパティを肩代わりしているだけだし、
base要素は空要素のはずなのに、後続要素を包含してしまったりするし。
DOM はプラットフォーム中立・言語中立のインターフェイスのはずなのに、
MSIE の所為で、旧来のDHTML同様に余計な分岐処理を強いることになる。
CSS2 の実装も遅れてるし、MS はウェブの発展を著しく阻害している。
703 ：Name_Not_Found：03/12/22 00:54 ID:???
704 ：Name_Not_Found：03/12/26 02:38 ID:???
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="ja">
<head>
<title>XSLT関数をWindows上のPHP4.3.4で実行する際の注意</title>
</head><body>
<h1>テスト見出し1</h1>
<blockquote style="padding: 0.5em; border-width: 0em 0em 0em 3em;
border-style: none none none solid; border-color: gray gray gray gray;">
<p>テスト</p>
</blockquote>
<h2>テスト見出し2</h2>
</body></html>
IE6の標準モードだとblockquoteにパディングとボーダーを指定すると
なぜか「テスト見出し2」、というより後に続くブロック要素全部が
左にはみでるんだけど、これって仕様なんでしょうか。
Mozilla1.6だと特に問題はありませんでした。
ボーダーかパディングか、どちらかだけなら平気なのですが。
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="ja">
<head>
<title>XSLT関数をWindows上のPHP4.3.4で実行する際の注意</title>
</head><body>
<h1>テスト見出し1</h1>
<blockquote style="padding: 0.5em; border-width: 0em 0em 0em 3em;
border-style: none none none solid; border-color: gray gray gray gray;">
<p>テスト</p>
</blockquote>
<h2>テスト見出し2</h2>
</body></html>
IE6の標準モードだとblockquoteにパディングとボーダーを指定すると
なぜか「テスト見出し2」、というより後に続くブロック要素全部が
左にはみでるんだけど、これって仕様なんでしょうか。
Mozilla1.6だと特に問題はありませんでした。
ボーダーかパディングか、どちらかだけなら平気なのですが。
705 ：Name_Not_Found：03/12/26 02:40 ID:???
コピペするときにタイトル変えるの忘れた・・・。吊ってきます。
706 ：Name_Not_Found：03/12/26 11:03 ID:???
>>704 これか。
同一要素を繰り返して置いたときにその要素が次第に左へ寄っていく(IE5.5)
http://cssbug.at.infoseek.co.jp/detail/winie/b009.html
同一要素を繰り返して置いたときにその要素が次第に左へ寄っていく(IE5.5)
http://cssbug.at.infoseek.co.jp/detail/winie/b009.html
707 ：Name_Not_Found：03/12/26 11:08 ID:???
http://cssbug.at.infoseek.co.jp/detail/winie/b009.html
>左ボーダーを子要素（この例ではdiv要素）に指定するとバグを回避することができます。
でも>>704は左辺にborderを設定してるし。
>左ボーダーを子要素（この例ではdiv要素）に指定するとバグを回避することができます。
でも>>704は左辺にborderを設定してるし。
既出でしたか。「ボーダー」と「パディング」で検索していたので
気が付きませんでした。
手元で実験してみたところ、左だけでなく、ボーダーを右に設定すると
右にもずれるようです。
気が付きませんでした。
手元で実験してみたところ、左だけでなく、ボーダーを右に設定すると
右にもずれるようです。
709 ：Name_Not_Found：03/12/26 11:28 ID:???
>>702
> 要素間の空白ノードを勝手に取り除いたりもします。
http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/introduction.html
> Note: There may be some variations depending on the parser being
> used to build the DOM. For instance, the DOM may not contain
> whitespaces in element content if the parser discards them.
(DOM構築に用いられるパーザにより若干の差異が存在する。
具体的には、パーザが要素内容中の空白文字を破棄する場合は、
DOMはこれを含まなくてもよい。)
その件については空白を破棄してもよい場合があるので注意。
> 要素間の空白ノードを勝手に取り除いたりもします。
http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/introduction.html
> Note: There may be some variations depending on the parser being
> used to build the DOM. For instance, the DOM may not contain
> whitespaces in element content if the parser discards them.
(DOM構築に用いられるパーザにより若干の差異が存在する。
具体的には、パーザが要素内容中の空白文字を破棄する場合は、
DOMはこれを含まなくてもよい。)
その件については空白を破棄してもよい場合があるので注意。
710 ：Name_Not_Found：03/12/26 20:32 ID:???
CSS質問スレ26から来ました。IE6、5.5（その他はわかりません）で
body { line-height:1.3em; }
div.example { border:1px solid #000; }
dt { width:7em;float:left; }
として、
<div class="example">
<dl>
<dt>ほにゃほにゃ</dt><dd>なんとかかんとか</dd>
<dt>ほげほげ</dt><dd>なんとかかんとか</dd>
<dt>ぽにゃぽにゃ</dt><dd>なんとかかんとか</dd>
</dl>
</div>
とすると、定義リストの間に
exampleで指定した色のborder-topが表示されてしまいます。
div.exampleかdlにbackground-colorを指定すると解消されるようです。
body { line-height:1.3em; }
div.example { border:1px solid #000; }
dt { width:7em;float:left; }
として、
<div class="example">
<dl>
<dt>ほにゃほにゃ</dt><dd>なんとかかんとか</dd>
<dt>ほげほげ</dt><dd>なんとかかんとか</dd>
<dt>ぽにゃぽにゃ</dt><dd>なんとかかんとか</dd>
</dl>
</div>
とすると、定義リストの間に
exampleで指定した色のborder-topが表示されてしまいます。
div.exampleかdlにbackground-colorを指定すると解消されるようです。
711 ：Name_Not_Found：03/12/26 21:05 ID:???
712 ：Name_Not_Found：03/12/27 00:09 ID:???
713 ：Name_Not_Found：04/01/02 20:45 ID:???
---CSS
IMG { border:1px solid red; vertical-align:bottom; }
---HTML
<div><img src="hoge.gif" width="100" height="10"></div>
IE6だと画像の右に不可解な半角スペース？が出てくるせいでレイアウトがずれます。
たとえばCtrl+マウスホイールすることで画像の位置が上下に移動します。
vertical-align:top/middle/bottom;が原因です。
IMG { border:1px solid red; vertical-align:bottom; }
---HTML
<div><img src="hoge.gif" width="100" height="10"></div>
IE6だと画像の右に不可解な半角スペース？が出てくるせいでレイアウトがずれます。
たとえばCtrl+マウスホイールすることで画像の位置が上下に移動します。
vertical-align:top/middle/bottom;が原因です。
714 ：Name_Not_Found：04/01/03 09:05 ID:???
仕樣通り？ でも困るナア。
http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_in_opera_20031226
Opera 7.03
Opera 7.1
ルビ関連要素へのスタイル付けは有効
Opera 7.21
Opera 7.23
Opera 7.50 Preview 1
ルビ関連要素へのスタイル付けは無効
但し、無効だった7.21以降のバージョンでも、ファイルの拡張子をxhtml（またはxml）
にするとスタイル付けが有効になったので意表を突かれたり。暫し黙考して、どうやら
「text/htmlなファイルでは、HTMLの仕様に無い要素へのスタイル付けはできない」と
いうことかと見当がつきました。
http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_in_opera_20031226
Opera 7.03
Opera 7.1
ルビ関連要素へのスタイル付けは有効
Opera 7.21
Opera 7.23
Opera 7.50 Preview 1
ルビ関連要素へのスタイル付けは無効
但し、無効だった7.21以降のバージョンでも、ファイルの拡張子をxhtml（またはxml）
にするとスタイル付けが有効になったので意表を突かれたり。暫し黙考して、どうやら
「text/htmlなファイルでは、HTMLの仕様に無い要素へのスタイル付けはできない」と
いうことかと見当がつきました。
715 ：Netscape4.78使い：04/01/04 11:20 ID:???
</p>は省略可のはずなのに、<blockquote>の内側で</p>を省略すると
不具合が出ます。途中に<!-- -->を挟むといけないようです。
それ以上の詳細は調べていないのですが具体例こちら。
http://www.dennougedougakkai-ndd.org/abt-buggy.html [表示がおかしい]
http://www.dennougedougakkai-ndd.org/abteilungsversammlung.html [</p>を入れて対応済]
不具合が出ます。途中に<!-- -->を挟むといけないようです。
それ以上の詳細は調べていないのですが具体例こちら。
http://www.dennougedougakkai-ndd.org/abt-buggy.html [表示がおかしい]
http://www.dennougedougakkai-ndd.org/abteilungsversammlung.html [</p>を入れて対応済]
716 ：Name_Not_Found：04/01/06 02:26 ID:???
/* CSS･スタイルシート質問スレッド【26】 */の307です。
バグなのかどうか分かりませんが報告します。環境はMac OSX 10.2.6です。
<head>
<style type="text/css">
<!--
body{color:#000; background-color:#fff}
a:link {text-decoration:none;color:#000;background-color:#ccc;}
a.visited{text-decoration:none;color:#000;background-color:#ccc;}
a:hover{color:#fff;background-color:#f00;}
a:active{color:#fff;background-color:#00f;}
a:link img{text-decoration:none;color:#000;background-color:#ccc;}
a:visited img{text-decoration:none;color:#000;background-color:#ccc;}
a:hover img{color:#0f0;background-color:#0f0;}
a:active img{color:#fff;background-color:#00f;}
-->
</style>
</head>
<body>
<a href="x">画像だよ<img src="あーたら.jpg" alt="あーたら"></a>
</body>
上記のソースでhoverの表示ですが、テキストに指定されたhoverの#f00が画像の下にも表示されます。
a:hover imgに、vertical-align:bottom;を追加指定すると、その#f00が、
Mozilla 1.2.1では消えますが、Safari 1.0(v85)、Opera 6.0、IE 5.2では消えません。
バグなのかどうか分かりませんが報告します。環境はMac OSX 10.2.6です。
<head>
<style type="text/css">
<!--
body{color:#000; background-color:#fff}
a:link {text-decoration:none;color:#000;background-color:#ccc;}
a.visited{text-decoration:none;color:#000;background-color:#ccc;}
a:hover{color:#fff;background-color:#f00;}
a:active{color:#fff;background-color:#00f;}
a:link img{text-decoration:none;color:#000;background-color:#ccc;}
a:visited img{text-decoration:none;color:#000;background-color:#ccc;}
a:hover img{color:#0f0;background-color:#0f0;}
a:active img{color:#fff;background-color:#00f;}
-->
</style>
</head>
<body>
<a href="x">画像だよ<img src="あーたら.jpg" alt="あーたら"></a>
</body>
上記のソースでhoverの表示ですが、テキストに指定されたhoverの#f00が画像の下にも表示されます。
a:hover imgに、vertical-align:bottom;を追加指定すると、その#f00が、
Mozilla 1.2.1では消えますが、Safari 1.0(v85)、Opera 6.0、IE 5.2では消えません。
717 ：Name_Not_Found：04/01/06 10:57 ID:???
http://pc2.2ch.net/test/read.cgi/hp/1072018825/308-309
308 ：Name_Not_Found ：04/01/06 05:11 ID:???
>307の補足。
vertical-align:bottom;を、
a:link img、a:visited img、a:hover img、a:active img、全てに付けてみた。
そしたら、Mozilla 1.2.1、Safari 1.0(v85)、IE 5.2では、画像の下のhoverの赤が消えた。
Opera 6.0で消えない。
309 ：Name_Not_Found ：04/01/06 05:18 ID:???
あ、、、a:link imgに付けるだけで>308と同じですね。
そして今更、>289を読み間違えてたことに気付いた。
308 ：Name_Not_Found ：04/01/06 05:11 ID:???
>307の補足。
vertical-align:bottom;を、
a:link img、a:visited img、a:hover img、a:active img、全てに付けてみた。
そしたら、Mozilla 1.2.1、Safari 1.0(v85)、IE 5.2では、画像の下のhoverの赤が消えた。
Opera 6.0で消えない。
309 ：Name_Not_Found ：04/01/06 05:18 ID:???
あ、、、a:link imgに付けるだけで>308と同じですね。
そして今更、>289を読み間違えてたことに気付いた。
718 ：Name_Not_Found：04/01/07 04:23 ID:???
CSS関連リンク集 http://cssbug.at.infoseek.co.jp/link.html
「スタイルシート（CSS）のトラブル、バグ集」は移転しました。
旧：http://dhr.tripod.co.jp/stylebug2.htm
新：http://dhr.at.infoseek.co.jp/stylebug2.htm
「スタイルシート（CSS）のトラブル、バグ集」は移転しました。
旧：http://dhr.tripod.co.jp/stylebug2.htm
新：http://dhr.at.infoseek.co.jp/stylebug2.htm
719 ：Name_Not_Found：04/01/08 02:26 ID:???
>716-717 関連
vertical-align:bottomを行内でheightが最大の要素に指定すると、
vertical-align:topを指定したようなレイアウトになってしまう。
WindowsのIE5.5/6(標準/互換)にて確認。
再現例
p {border:1px solid black; padding:0px;}
big {font-size:xx-large; background-color:#aa0;}
em {font-size:x-large; background-color:#aa0; margin:0px;}
q {font-size:xx-small; background-color:#aa0; margin:0px; vertical-align:bottom;}
<p>通常<em style="vertical-align:baseline;">強調(baseline)</em>続き<q>引用</q>終端</p>
<p>通常<em style="vertical-align:top;">強調(top)</em>続き<q>引用</q>終端</p>
<p>通常<em style="vertical-align:bottom;">強調(bottom)</em>続き<q>引用</q>終端</p>
<p><big>最大</big>通常<em style="vertical-align:top;">強調(top)</em>続き<q>引用</q>終端</p>
<p><big>最大</big>通常<em style="vertical-align:bottom;">強調(bottom)</em>続き<q>引用</q>終端</p>
# 上記でMozillaの場合emとqの上下に隙間が空くのは何故だろう…
vertical-align:bottomを行内でheightが最大の要素に指定すると、
vertical-align:topを指定したようなレイアウトになってしまう。
WindowsのIE5.5/6(標準/互換)にて確認。
再現例
p {border:1px solid black; padding:0px;}
big {font-size:xx-large; background-color:#aa0;}
em {font-size:x-large; background-color:#aa0; margin:0px;}
q {font-size:xx-small; background-color:#aa0; margin:0px; vertical-align:bottom;}
<p>通常<em style="vertical-align:baseline;">強調(baseline)</em>続き<q>引用</q>終端</p>
<p>通常<em style="vertical-align:top;">強調(top)</em>続き<q>引用</q>終端</p>
<p>通常<em style="vertical-align:bottom;">強調(bottom)</em>続き<q>引用</q>終端</p>
<p><big>最大</big>通常<em style="vertical-align:top;">強調(top)</em>続き<q>引用</q>終端</p>
<p><big>最大</big>通常<em style="vertical-align:bottom;">強調(bottom)</em>続き<q>引用</q>終端</p>
# 上記でMozillaの場合emとqの上下に隙間が空くのは何故だろう…
720 ：Name_Not_Found：04/01/08 10:22 ID:???
721 ：Name_Not_Found：04/01/09 14:52 ID:???
>>719
>上記でMozillaの場合emとqの上下に隙間が空くのは何故だろう…
デフォルトの line-height が適用されているからです。
指定値「normal」は、UA が適切な算出値を設定することになっています。
各インライン要素に対して line-height: 1; を適用すれば隙間は消えます。
vertical-align の「top」と「bottom」はボックスの上辺か下辺を、
行ボックスの上辺か下辺に揃えるという意味です。
非置換インライン要素の高さは line-height によって決まります。
例えばデフォルトで 1.2 ぐらいの実数値が割り当てられていれば、
グリフ（字形）の上下に約 0.1em 分のスペースが均等に挿入されます。
ボーダーやパディングはボックスの周囲には表示されるのですが、
“インラインボックスの高さを計算するのには使用されません”。
行ボックスの高さからはみ出す周辺領域は切り落としてもよいことになっています。
>上記でMozillaの場合emとqの上下に隙間が空くのは何故だろう…
デフォルトの line-height が適用されているからです。
指定値「normal」は、UA が適切な算出値を設定することになっています。
各インライン要素に対して line-height: 1; を適用すれば隙間は消えます。
vertical-align の「top」と「bottom」はボックスの上辺か下辺を、
行ボックスの上辺か下辺に揃えるという意味です。
非置換インライン要素の高さは line-height によって決まります。
例えばデフォルトで 1.2 ぐらいの実数値が割り当てられていれば、
グリフ（字形）の上下に約 0.1em 分のスペースが均等に挿入されます。
ボーダーやパディングはボックスの周囲には表示されるのですが、
“インラインボックスの高さを計算するのには使用されません”。
行ボックスの高さからはみ出す周辺領域は切り落としてもよいことになっています。
>721
なるほど、了解しました。すると>719においてbig,em,qそれぞれに
line-height:1; margin:0; padding:0;
を追加した時、IEで一部はみ出てるのはやっぱバグなんだろうなぁ。
qをvertical-align:4em;なんて変えると極端になるけど、そうか、
http://cssbug.at.infoseek.co.jp/detail/winie/b087.html
と同事象か。うーん。
なるほど、了解しました。すると>719においてbig,em,qそれぞれに
line-height:1; margin:0; padding:0;
を追加した時、IEで一部はみ出てるのはやっぱバグなんだろうなぁ。
qをvertical-align:4em;なんて変えると極端になるけど、そうか、
http://cssbug.at.infoseek.co.jp/detail/winie/b087.html
と同事象か。うーん。
723 ：Name_Not_Found：04/01/12 00:19 ID:???
「hr要素へのスタイル指定」にSafariの情報を。
http://cssbug.at.infoseek.co.jp/misc/hr.html
http://pc2.2ch.net/test/read.cgi/hp/1041996555/205-207
205 名前：Name_Not_Found ：04/01/11 22:50 ID:???
Sfariでは、罫線<HR>のCOLOR指定は対応していないのですね…
罫線に色づけして他の色と同系色に合わせて使っているので、
これだけ色付きになってなくてショック。
そのうち対応してくれるのかな…
それとも、Sfariでも罫線に色つけられる方法ってあります?
206 名前：Name_Not_Found ：04/01/11 23:01 ID:etVTjDyn
border-color と background-color でもだめ？
207 名前：205 ：04/01/11 23:30 ID:???
あ、いけましたいけました!!
おっしゃる通り、スタイルのbackground-colorで。
で、これだけじゃ陰影がわずかについてくるので、
IEで見るCOLOR属性と同じようなくっきり線にするには
border-style:solid ですね。
言われてみれば単純なことでした。ありがとうございました。
http://cssbug.at.infoseek.co.jp/misc/hr.html
http://pc2.2ch.net/test/read.cgi/hp/1041996555/205-207
205 名前：Name_Not_Found ：04/01/11 22:50 ID:???
Sfariでは、罫線<HR>のCOLOR指定は対応していないのですね…
罫線に色づけして他の色と同系色に合わせて使っているので、
これだけ色付きになってなくてショック。
そのうち対応してくれるのかな…
それとも、Sfariでも罫線に色つけられる方法ってあります?
206 名前：Name_Not_Found ：04/01/11 23:01 ID:etVTjDyn
border-color と background-color でもだめ？
207 名前：205 ：04/01/11 23:30 ID:???
あ、いけましたいけました!!
おっしゃる通り、スタイルのbackground-colorで。
で、これだけじゃ陰影がわずかについてくるので、
IEで見るCOLOR属性と同じようなくっきり線にするには
border-style:solid ですね。
言われてみれば単純なことでした。ありがとうございました。
724 ：Name_Not_Found：04/01/12 15:23 ID:YUsLnhgY
Safari v100.1 でthに指定したbackground-colorが無効になってるページが
あるんだけど、条件が分からない…。時間があったら検証してみようかな。
あるんだけど、条件が分からない…。時間があったら検証してみようかな。
725 ：Name_Not_Found：04/01/13 05:20 ID:???
http://members.at.infoseek.co.jp/cssbug/detail/winie/b071.html
と雰囲気だけ似てるバグのようなものに気付いた。
何もスタイルを適用せずに
<ul>
<li>○○</li>
<li><ul>
<li>××</li>
<li>△△</li>
</ul></li>
</ul>
とすると、2層目のul要素があるべき場所から一行下がる。
とりあえずli要素にborderを指定するとちゃんとした表示になる。
まさか
<li><ul>(</li>)〜
なんて風に解釈してるのか、とも思ったけど、スタイルを適用すると直るのも変な話で。
と雰囲気だけ似てるバグのようなものに気付いた。
何もスタイルを適用せずに
<ul>
<li>○○</li>
<li><ul>
<li>××</li>
<li>△△</li>
</ul></li>
</ul>
とすると、2層目のul要素があるべき場所から一行下がる。
とりあえずli要素にborderを指定するとちゃんとした表示になる。
まさか
<li><ul>(</li>)〜
なんて風に解釈してるのか、とも思ったけど、スタイルを適用すると直るのも変な話で。
726 ：Name_Not_Found：04/01/13 05:37 ID:???
http://members.at.infoseek.co.jp/cssbug/detail/winie/b028.html
こっち見落としてた(´Д`;)
dl要素だけじゃなくul要素でも発生しますよ、って事で勘弁…
こっち見落としてた(´Д`;)
dl要素だけじゃなくul要素でも発生しますよ、って事で勘弁…
727 ：Name_Not_Found：04/01/17 15:50 ID:/XqC6ZuD
http://cssbug.at.infoseek.co.jp/index.html
>制作メモ（2003-12-11更新）
2004-01-16、ですよね？ 更新おつかれさまです。
ところで、>>707はWinIEバグ009への修正になりませんか？
>制作メモ（2003-12-11更新）
2004-01-16、ですよね？ 更新おつかれさまです。
ところで、>>707はWinIEバグ009への修正になりませんか？
728 ：Name_Not_Found：04/01/21 10:54 ID:???
floatで回り込ませたdivが、
ちゃんと回り込めずに重なって表示されてしまうんだけど
これはブラウザが対応してないのかバグなのか・・・。
ちゃんと回り込めずに重なって表示されてしまうんだけど
これはブラウザが対応してないのかバグなのか・・・。
729 ：Name_Not_Found：04/01/21 11:00 ID:???
>>728 質問スレッドでFAQを見てから尋ねて下さい。ブラウザ名とヴァージョンも忘れずに。
730 ：Name_Not_Found：04/01/21 13:04 ID:???
幅や高さを指定した要素内にあるフロートの下マージンが無視される(IE6)
http://cssbug.at.infoseek.co.jp/detail/winie/b096.html
Mozillaでもfloatの後のclearした要素のmarginが効かないらしい。
http://pc2.2ch.net/test/read.cgi/hp/1072018825/780-
http://cssbug.at.infoseek.co.jp/detail/winie/b096.html
Mozillaでもfloatの後のclearした要素のmarginが効かないらしい。
http://pc2.2ch.net/test/read.cgi/hp/1072018825/780-
731 ：Name_Not_Found：04/01/21 19:56 ID:???
http://pc2.2ch.net/test/read.cgi/hp/1072018825/784
＞Mozilla が正しい実装です。'clear: left' の効果は：
＞>要素のボーダー上辺が、ソース文書内でそれ以前に出現するあらゆる左フロートの外下辺より下であるように、要素が生成するボックスの上マージンを十分大きくする。
＞従ってh3要素の上マージンの指定は、ボーダー上辺を揃えるために無視されます。
＞Mozilla が正しい実装です。'clear: left' の効果は：
＞>要素のボーダー上辺が、ソース文書内でそれ以前に出現するあらゆる左フロートの外下辺より下であるように、要素が生成するボックスの上マージンを十分大きくする。
＞従ってh3要素の上マージンの指定は、ボーダー上辺を揃えるために無視されます。
732 ：Name_Not_Found：04/01/24 08:58 ID:???
780 ：Name_Not_Found ：04/01/21 12:43 ID:++dQIGAQ
---------------------------------------------------------------
<h3>其の一</h3>
<img src="./img/1.jpg" width="120" height="120" alt="米" />
<p>みんな米を食べようぜ</p>
<h3>其の二</h3>
<img src="./img/2.jpg" width="120" height="120" alt="酒" />
<p>酒飲もうぜ</p>
<h3>其の三</h3>
<img src="./img/3.jpg" width="120" height="120" alt="魚" />
<p>酒魚うまいぜ</p>
---------------------------------------------------------------
img {
float : left;
}
h3 {
clear : left;
margin : 1em 0em 0em 0em;
}
p {
margin : 0em;
}
---------------------------------------------------------------
ネスケとかモジラで見るとimgとh3の間にスペースができません。
---------------------------------------------------------------
<h3>其の一</h3>
<img src="./img/1.jpg" width="120" height="120" alt="米" />
<p>みんな米を食べようぜ</p>
<h3>其の二</h3>
<img src="./img/2.jpg" width="120" height="120" alt="酒" />
<p>酒飲もうぜ</p>
<h3>其の三</h3>
<img src="./img/3.jpg" width="120" height="120" alt="魚" />
<p>酒魚うまいぜ</p>
---------------------------------------------------------------
img {
float : left;
}
h3 {
clear : left;
margin : 1em 0em 0em 0em;
}
p {
margin : 0em;
}
---------------------------------------------------------------
ネスケとかモジラで見るとimgとh3の間にスペースができません。
733 ：Name_Not_Found：04/01/24 10:06 ID:???
匿名ブロック
734 ：IE6.0+html4.01 strict通常モード、及び互換モードで確認：04/01/24 18:12 ID:???
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type"content="text/javascript">
<meta http-equiv="Content-Style-Type"content="text/css">
<meta name="content-language"content="ja">
<style type="text/css">
<!--
div.cnt { margin: 1em; }
a:link { border-width: 0; padding: 1px; }
a:visited { border-width: 0; padding: 1px; }
a:hover { border: 1px solid #f00; padding: 0; }
a:active { border: 1px solid #f00; padding: 0; }
h1:first-letter { color: #00f; }
-->
</style>
<title>bag</title>
</head>
<html lang="ja">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type"content="text/javascript">
<meta http-equiv="Content-Style-Type"content="text/css">
<meta name="content-language"content="ja">
<style type="text/css">
<!--
div.cnt { margin: 1em; }
a:link { border-width: 0; padding: 1px; }
a:visited { border-width: 0; padding: 1px; }
a:hover { border: 1px solid #f00; padding: 0; }
a:active { border: 1px solid #f00; padding: 0; }
h1:first-letter { color: #00f; }
-->
</style>
<title>bag</title>
</head>
<body>
<h1>1番目の階層に含まれるfirst-letter指定hn</h1>
<h1>1番目の階層に含まれるfirst-letter指定hn</h1>
<div class="cnt">
<p>
??<a href="#">これは動かない</a><br>
最初の<a>タグは正常に修飾される
</p>
<a href="#">階層が少ない例（第2階層）</a>
</div>
<h1>1番目の階層に含まれるfirst-letter指定hn</h1>
<div class="cnt">
<p>
??<a href="#">これが何故か動く（第3階層）</a><br>
</p>
<a href="#">階層が少ない例（第2階層）</a>
</div>
<a href="#">さらに階層が少ない例（第1階層なので不正）
</body>
</html>
<a>タグにPaddingを指定、これをhover時と通常時の間で違う値にした上で、
左marginをemで指定した親要素の下に置き、さらにそのmarginを指定した要素と同じ階層にhnを置き、これにfirst-letter疑似クラスでcolorを指定すると、
hover時に<a>の位置がずれる（親要素のpaddingが狂う？）。
解消方法としては、親要素の左marginを0にする。
<h1>1番目の階層に含まれるfirst-letter指定hn</h1>
<h1>1番目の階層に含まれるfirst-letter指定hn</h1>
<div class="cnt">
<p>
??<a href="#">これは動かない</a><br>
最初の<a>タグは正常に修飾される
</p>
<a href="#">階層が少ない例（第2階層）</a>
</div>
<h1>1番目の階層に含まれるfirst-letter指定hn</h1>
<div class="cnt">
<p>
??<a href="#">これが何故か動く（第3階層）</a><br>
</p>
<a href="#">階層が少ない例（第2階層）</a>
</div>
<a href="#">さらに階層が少ない例（第1階層なので不正）
</body>
</html>
<a>タグにPaddingを指定、これをhover時と通常時の間で違う値にした上で、
左marginをemで指定した親要素の下に置き、さらにそのmarginを指定した要素と同じ階層にhnを置き、これにfirst-letter疑似クラスでcolorを指定すると、
hover時に<a>の位置がずれる（親要素のpaddingが狂う？）。
解消方法としては、親要素の左marginを0にする。
736 ：Name_Not_Found：04/01/24 18:14 ID:???
>>735 =~ s/emで//
737 ：Name_Not_Found：04/01/24 21:23 ID:2j+sbVPx
738 ：Name_Not_Found：04/01/25 05:06 ID:???
【IE6】
img要素を内包する要素へのline-height指定が効かない。
img要素を内包する要素へのline-height指定が効かない。
739 ：Name_Not_Found：04/01/25 19:15 ID:???
>>738 そんなこたぁない。
740 ：Name_Not_Found：04/01/25 19:29 ID:???
>>739
え、そうですか？失礼致しました。
え、そうですか？失礼致しました。
741 ：Name_Not_Found：04/01/25 19:46 ID:???
>>740
ソース出しなさいな。でないと確認もできない。
ソース出しなさいな。でないと確認もできない。
742 ：Name_Not_Found：04/01/25 20:09 ID:DakUhQzu
>>734-735は無視？
<html>
<head>
<title>テスト</title>
<style>
<!--
p{
line-height:2;
border:1px solid black;
padding:0px;
}
-->
</style>
</head>
<body>
<p>
効かない<img src="hoge.png" alt="hoge" width="8" height="6" /><br />効かない
</p>
<p>
効く効く効く<br />効く効く
</p>
</body>
</html>
どうでしょうか？
<head>
<title>テスト</title>
<style>
<!--
p{
line-height:2;
border:1px solid black;
padding:0px;
}
-->
</style>
</head>
<body>
<p>
効かない<img src="hoge.png" alt="hoge" width="8" height="6" /><br />効かない
</p>
<p>
効く効く効く<br />効く効く
</p>
</body>
</html>
どうでしょうか？
744 ：Name_Not_Found：04/01/25 20:20 ID:???
745 ：Name_Not_Found：04/01/25 20:58 ID:???
>>742 無視って……そんなにせくなよ。バグ辞典サイトに登録されるのを待つべし。
746 ：Name_Not_Found：04/01/25 21:23 ID:???
そもそもインライン要素にmarginやpaddingって効いて良いものだったか
747 ：Name_Not_Found：04/01/25 21:27 ID:???
>>743
精確には――
置換インライン要素（img）を含む行の前後のみ、line-heightが指定値より狭まる。
自働折り返しや<br>で改行されて問題の行より２行以上離れた行では指定通りに効く。
p {
width:43px;
line-height:4em;
border:1px solid red;
padding:0;
font-size:10px;
}
<p>効く効く<br>
効く効く効かない<img src="dummy" alt="" width="3" height="10">
効かない効く効く効く効く
</p>
精確には――
置換インライン要素（img）を含む行の前後のみ、line-heightが指定値より狭まる。
自働折り返しや<br>で改行されて問題の行より２行以上離れた行では指定通りに効く。
p {
width:43px;
line-height:4em;
border:1px solid red;
padding:0;
font-size:10px;
}
<p>効く効く<br>
効く効く効かない<img src="dummy" alt="" width="3" height="10">
効かない効く効く効く効く
</p>
748 ：Name_Not_Found：04/01/25 23:07 ID:???
…お前ら、事前に質問スレで揉んでから書き込んでください。
749 ：Name_Not_Found：04/01/28 01:03 ID:???
更新祝ひアゲ。
http://cssbug.at.infoseek.co.jp/index.html
ここは前回の修正漏れかな？
http://cssbug.at.infoseek.co.jp/detail/winie.html
[1-67][1-69]li要素の子孫にdl要素があるとリストマークが上方にずれる
↓
[1-67][1-69][3-725]li要素の子孫にリスト要素があるとリストマークが上方にずれる
http://cssbug.at.infoseek.co.jp/index.html
ここは前回の修正漏れかな？
http://cssbug.at.infoseek.co.jp/detail/winie.html
[1-67][1-69]li要素の子孫にdl要素があるとリストマークが上方にずれる
↓
[1-67][1-69][3-725]li要素の子孫にリスト要素があるとリストマークが上方にずれる
750 ：Name_Not_Found：04/01/31 13:35 ID:???
【Opera7.23/Win98SE】
背景に指定したアニメーションGIF画像への対応が不完全(6.0/7.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b048.html
>Opera6および7ではGIFアニメーション画像を背景画像に指定すると、アニメーショ
>ンせずに1コマ目の画像を表示したままになる。ただしOpera7ではアニメーションが
>再生される場合もある。
Opera7.23ではアニメが動きますが、動きが普通よりかなりのろい。
ex. http://www.musubime.com/computer/css/css.html
しかも異様にスクロールが重くなって、閲覧に困難を感じる。↓
ex. http://cssbug.at.infoseek.co.jp/detail/opera/b048.html
Opera7にだけスタイルを適用させない方法はないものか。
背景に指定したアニメーションGIF画像への対応が不完全(6.0/7.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b048.html
>Opera6および7ではGIFアニメーション画像を背景画像に指定すると、アニメーショ
>ンせずに1コマ目の画像を表示したままになる。ただしOpera7ではアニメーションが
>再生される場合もある。
Opera7.23ではアニメが動きますが、動きが普通よりかなりのろい。
ex. http://www.musubime.com/computer/css/css.html
しかも異様にスクロールが重くなって、閲覧に困難を感じる。↓
ex. http://cssbug.at.infoseek.co.jp/detail/opera/b048.html
Opera7にだけスタイルを適用させない方法はないものか。
751 ：Name_Not_Found：04/01/31 15:44 ID:???
>>750
振り分けはXSSIでやればいいんでないか。
そうじゃなければ今やっているようにJavaScriptでやるとか。
これなら、ふだんJavaScriptをオフにしている人もアニGIFを
背景に使っているようなゴミCSSを受け取らなくてすむ。
一応書いておくと、 navigator.userAgent の中に「Opera/7」か
「Opera 7」が含まれていないか調べりゃ分かる。
例えばOpera7かどうかは下記のif文でチェックできる。
if (navigator.userAgent.match(/Opera.7/)) {
振り分けはXSSIでやればいいんでないか。
そうじゃなければ今やっているようにJavaScriptでやるとか。
これなら、ふだんJavaScriptをオフにしている人もアニGIFを
背景に使っているようなゴミCSSを受け取らなくてすむ。
一応書いておくと、 navigator.userAgent の中に「Opera/7」か
「Opera 7」が含まれていないか調べりゃ分かる。
例えばOpera7かどうかは下記のif文でチェックできる。
if (navigator.userAgent.match(/Opera.7/)) {
752 ：Name_Not_Found：04/01/31 16:19 ID:???
>今やっているように
いや、JavaScriptはやってなくてね。@mediaとかのバグでできないかなぁって。
Scriptオフで見られても大丈夫にするため。
Opera6ならうまい手があったんだけど、7はなまじ対応がいいからね。
http://cssbug.at.infoseek.co.jp/detail/opera/b013.html
いや、JavaScriptはやってなくてね。@mediaとかのバグでできないかなぁって。
Scriptオフで見られても大丈夫にするため。
Opera6ならうまい手があったんだけど、7はなまじ対応がいいからね。
http://cssbug.at.infoseek.co.jp/detail/opera/b013.html
753 ：Name_Not_Found：04/01/31 16:29 ID:???
>>752=750
> いや、JavaScriptはやってなくてね。
藻前は自分の提示したページのやり方を把握してないのか？
JavaScriptでCSSの振り分けをしているじゃないか。
メインページの方はJSじゃなくて、あのページだけという
のならわかるが
> いや、JavaScriptはやってなくてね。
って、なんだ？
CSS以前の問題として、漏れはIEでもMozillaでもOperaでも
アニメーションGIFのアニメーションはふだんオフにしている。
うざいからオフにしている香具師はそれなりにいる。
> いや、JavaScriptはやってなくてね。
藻前は自分の提示したページのやり方を把握してないのか？
JavaScriptでCSSの振り分けをしているじゃないか。
メインページの方はJSじゃなくて、あのページだけという
のならわかるが
> いや、JavaScriptはやってなくてね。
って、なんだ？
CSS以前の問題として、漏れはIEでもMozillaでもOperaでも
アニメーションGIFのアニメーションはふだんオフにしている。
うざいからオフにしている香具師はそれなりにいる。
754 ：Name_Not_Found：04/01/31 16:36 ID:???
>>753 早とちりめ。提示したのは一例であって、自分のページではないぞ。
755 ：Name_Not_Found：04/01/31 16:44 ID:???
756 ：Name_Not_Found：04/01/31 16:58 ID:???
何で喧嘩腰なんだか。
どうも>>751は、自分の好きでないGIFアニメを使用する人はみな敵視するらしい。
自分が使用できるXSSIはどこでも一般的に使用可能だと思ってるらしい。
エゴティズム。お子さまなんだよね。
どうも>>751は、自分の好きでないGIFアニメを使用する人はみな敵視するらしい。
自分が使用できるXSSIはどこでも一般的に使用可能だと思ってるらしい。
エゴティズム。お子さまなんだよね。
757 ：Name_Not_Found：04/01/31 17:12 ID:???
すでにスレ違いだ。両方ともどっか行け。
758 ：Name_Not_Found：04/01/31 17:28 ID:???
>>756
XSSIができないならできないと書くのは質問者側の役割です。
最初から書いておくべきでしょう。
JavaScriptを避けたいのなら最初からそれも書いておくのは当然だと思いますが。
それらを考慮せずに 相手のことばかり言うのはどんなものでしょう。
確かに無遠慮な書き方を>>751=753=755はしてますが、あなたはあなた
でたいへん失礼です。
XSSIができないならできないと書くのは質問者側の役割です。
最初から書いておくべきでしょう。
JavaScriptを避けたいのなら最初からそれも書いておくのは当然だと思いますが。
それらを考慮せずに 相手のことばかり言うのはどんなものでしょう。
確かに無遠慮な書き方を>>751=753=755はしてますが、あなたはあなた
でたいへん失礼です。
759 ：Name_Not_Found：04/01/31 17:35 ID:???
さてここは質問スレではないわけだが。
760 ：Name_Not_Found：04/01/31 17:46 ID:???
そゆこと。よそでやってくれ。
761 ：Name_Not_Found：04/02/02 00:27 ID:1i0EDZhq
Internet Explorer (Windows) CSSバグリスト
@importを用いたスタイルシートを使用するページを保存できない(IE6)
http://members.at.infoseek.co.jp/cssbug/detail/winie/b066.html
これの発生条件に追加
@import の使用していなくても link 要素で読み込む CSS ファイルが別ドメインにあれば保存できないようだ。
@importを用いたスタイルシートを使用するページを保存できない(IE6)
http://members.at.infoseek.co.jp/cssbug/detail/winie/b066.html
これの発生条件に追加
@import の使用していなくても link 要素で読み込む CSS ファイルが別ドメインにあれば保存できないようだ。
762 ：Name_Not_Found：04/02/02 01:48 ID:???
未確認バグ
両端揃えにした要素内で太字の文字列と太字でない文字列が重なる(N6)
http://cssbug.at.infoseek.co.jp/detail/mozilla/b035.html
Netscape7.1（Win98SE）で再現した。
strong {font-weight:900;}
p {text-align:justify;}
<p>詳しくは<strong>ttp://cssbug.at.infoseek.co.jp/detail/mozilla/b035.html</strong>を見よ。</p>
font-weightが600以上からバグが起こった。500以下では起きない。
両端揃えにした要素内で太字の文字列と太字でない文字列が重なる(N6)
http://cssbug.at.infoseek.co.jp/detail/mozilla/b035.html
Netscape7.1（Win98SE）で再現した。
strong {font-weight:900;}
p {text-align:justify;}
<p>詳しくは<strong>ttp://cssbug.at.infoseek.co.jp/detail/mozilla/b035.html</strong>を見よ。</p>
font-weightが600以上からバグが起こった。500以下では起きない。
763 ：Name_Not_Found：04/02/03 17:37 ID:???
Win版 MSIE 4〜5.5 （および ver 6 の互換モード）
html と body の背景が独立していない。（body への背景指定が優先される。）
Win版 MSIE 5.5〜6
width か height （もしくは両方）が明示されている場合，ボーダー領域に背景色が描画されない。
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/colors.html#background-color
html と body の背景が独立していない。（body への背景指定が優先される。）
Win版 MSIE 5.5〜6
width か height （もしくは両方）が明示されている場合，ボーダー領域に背景色が描画されない。
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/colors.html#background-color
764 ：Name_Not_Found：04/02/04 17:26 ID:???
「ブロックボックス化した要素を含むリストアイテムの後ろに空行が入る」
http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
いろいろ試したんだけど、IE5.0での対処法知りませんか？
http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
いろいろ試したんだけど、IE5.0での対処法知りませんか？
765 ：Name_Not_Found：04/02/04 19:55 ID:???
http://pc2.2ch.net/test/read.cgi/hp/1074845459/491-513
dt{
width : 8em;
float : left;
clear : left;
}
dd {margin-left:8.5em;}
<dl>
<dt>name</dt>
<dd><input></dd>
<dt>message</dt>
<dd><textarea></textarea></dd>
<dt>password</dt>
<dd><input></dd>
</dl>
とやると、Mac+Safariでpassword入力欄がtextareaに重なるらしい。
詳しいソースは質問スレッドの507。
>textareaだけrow属性のため他より高さがあるんだよね。
>たぶんSafariはこのバグと同じ解釈なのでは。
>
>先行するフロートの上方に後続のフロートが置かれる
>http://cssbug.at.infoseek.co.jp/detail/winie/b093.html
>http://cssbug.at.infoseek.co.jp/detail/opera/b044.html
dt{
width : 8em;
float : left;
clear : left;
}
dd {margin-left:8.5em;}
<dl>
<dt>name</dt>
<dd><input></dd>
<dt>message</dt>
<dd><textarea></textarea></dd>
<dt>password</dt>
<dd><input></dd>
</dl>
とやると、Mac+Safariでpassword入力欄がtextareaに重なるらしい。
詳しいソースは質問スレッドの507。
>textareaだけrow属性のため他より高さがあるんだよね。
>たぶんSafariはこのバグと同じ解釈なのでは。
>
>先行するフロートの上方に後続のフロートが置かれる
>http://cssbug.at.infoseek.co.jp/detail/winie/b093.html
>http://cssbug.at.infoseek.co.jp/detail/opera/b044.html
766 ：Name_Not_Found：04/02/04 19:59 ID:???
>>764 回避法が幾つか挙がってるけど、全部試して駄目だったの？
767 ：Name_Not_Found：04/02/04 20:42 ID:???
Safari1.2が出たので一通り確認してみた。
間違ってたらスマン。
■未修整(1.2で再現するバグ)
contentプロパティに指定した日本語文字が文字化けして表示される
contentプロパティでopen-quote, close-quote値を無視する
clearプロパティはnone以外の値からnone値に上書きできない
document.styleSheets[n].titleが常にnull値を返す
caption要素を含むテーブルではcol要素に対するスタイルが効かない
固定レイアウトテーブルでセル幅の%値指定時に算出値が不正確
■修正済！(1.2で再現しない)
空白文字のみのテキストノードを正常に取得できない
■未確認(わかんない)
名称に日本語文字を含むフォントファミリの指定を無視する
ファイル名にアンダーバーを含む外部スタイルシートを読み込まない
使用されるはずのないフォントで文字列が表示される
一部のフォントでボールド表示ができない
先に指定した代替スタイルシートを固定スタイルシートとして扱う
:hover擬似クラスでvertical-alignが無効
間違ってたらスマン。
■未修整(1.2で再現するバグ)
contentプロパティに指定した日本語文字が文字化けして表示される
contentプロパティでopen-quote, close-quote値を無視する
clearプロパティはnone以外の値からnone値に上書きできない
document.styleSheets[n].titleが常にnull値を返す
caption要素を含むテーブルではcol要素に対するスタイルが効かない
固定レイアウトテーブルでセル幅の%値指定時に算出値が不正確
■修正済！(1.2で再現しない)
空白文字のみのテキストノードを正常に取得できない
■未確認(わかんない)
名称に日本語文字を含むフォントファミリの指定を無視する
ファイル名にアンダーバーを含む外部スタイルシートを読み込まない
使用されるはずのないフォントで文字列が表示される
一部のフォントでボールド表示ができない
先に指定した代替スタイルシートを固定スタイルシートとして扱う
:hover擬似クラスでvertical-alignが無効
768 ：Name_Not_Found：04/02/05 01:13 ID:???
769 ：Name_Not_Found：04/02/05 13:43 ID:???
今週リリースされたばかりの Safari 1.2 です。
* {
color: inherit;
background: transparent;
}
BODY {
color: #000000;
background: #ffcccc;
margin: 1em 10%;
}
こういうようなスタイルを使っていたら、BODY の margin 部分に
背景色が付かなくなりました。ちなみに、全称セレクタはユーザー
スタイルの効果を消すために使っています。どうも、
HTML { background: transparent; }
BODY { background: #ffcccc; }
となっている時に HTML 要素の背景色をキャンバスの背景色として
採用してしまうようです。CCS2 によれば、HTML 要素の背景色が
transparent の場合は BODY 要素の背景色をキャンバスの背景色と
すべきとあります。
この問題は、Safari 1.0 などでは起こりません。1.2 になって
発生するようになりました。
* {
color: inherit;
background: transparent;
}
BODY {
color: #000000;
background: #ffcccc;
margin: 1em 10%;
}
こういうようなスタイルを使っていたら、BODY の margin 部分に
背景色が付かなくなりました。ちなみに、全称セレクタはユーザー
スタイルの効果を消すために使っています。どうも、
HTML { background: transparent; }
BODY { background: #ffcccc; }
となっている時に HTML 要素の背景色をキャンバスの背景色として
採用してしまうようです。CCS2 によれば、HTML 要素の背景色が
transparent の場合は BODY 要素の背景色をキャンバスの背景色と
すべきとあります。
この問題は、Safari 1.0 などでは起こりません。1.2 になって
発生するようになりました。
770 ：Name_Not_Found：04/02/05 16:17 ID:???
【Opera7.23】
bottom:0;に配置した要素の文字列が２行以上に折り返される場合、要素の下半分がウィンドウ外に隠れる。
#navbar {
position:fixed; z-index:5;
bottom:0; left:0;right:0;
margin-bottom:0;
}
<table id="navbar"><tr>
<th>menu</th>
<td>
<a href="1.htm">menu1</a> <a href="2.htm">menu2</a> <a href="3.htm">menu3</a> ……以下略
</td>
</tr></table>
但し、一度画面を最大化して再読込させてから元のサイズに戻すと、全部表示される。
ウィンドウ・サイズを横か縦かに拡大しても、隠れた部分が現れる。
しかし最初から最大表示にして読み込ませてもやはり隠れてダメで、元のサイズに戻すと現れる。
また、これはtableの問題になるが、上掲のソースで
#navbar td {text-align:right;}と追加指定して、
a要素を列べた後ろにaaaaaaa0000000......と半角英数字を長く長く長く書くと、
その英数字だけが表示されてa要素が消える困った現象が起きる。
bottom:0;に配置した要素の文字列が２行以上に折り返される場合、要素の下半分がウィンドウ外に隠れる。
#navbar {
position:fixed; z-index:5;
bottom:0; left:0;right:0;
margin-bottom:0;
}
<table id="navbar"><tr>
<th>menu</th>
<td>
<a href="1.htm">menu1</a> <a href="2.htm">menu2</a> <a href="3.htm">menu3</a> ……以下略
</td>
</tr></table>
但し、一度画面を最大化して再読込させてから元のサイズに戻すと、全部表示される。
ウィンドウ・サイズを横か縦かに拡大しても、隠れた部分が現れる。
しかし最初から最大表示にして読み込ませてもやはり隠れてダメで、元のサイズに戻すと現れる。
また、これはtableの問題になるが、上掲のソースで
#navbar td {text-align:right;}と追加指定して、
a要素を列べた後ろにaaaaaaa0000000......と半角英数字を長く長く長く書くと、
その英数字だけが表示されてa要素が消える困った現象が起きる。
771 ：Name_Not_Found：04/02/05 17:03 ID:???
【WinIE6標準／互換】
絶対配置でbottomを指定すると、ウィンドウ（表示領域）の最下部からの位置に配置される。
Netscape7.1やOpera7.23ではページの最下部からの位置に配置される。
#navbar {position:absolute; bottom:0; background:yellow;}
<body>
<div id="navbar">bottom:0;でどこに配置されるか？</div>
改行<br>改行<br>改行<br>改行<br>改行<br>改行<br>改行<br>……以下略
</body>
上の例だと、Netscape・Operaはスクロールしないと最下部の#navbarは見えてこない。
しかしWinIEはページの高さに関係なく最初からウィンドウの最下部に表示され、
スクロールすると一緒に上に移って見えなくなる。
絶対配置でbottomを指定すると、ウィンドウ（表示領域）の最下部からの位置に配置される。
Netscape7.1やOpera7.23ではページの最下部からの位置に配置される。
#navbar {position:absolute; bottom:0; background:yellow;}
<body>
<div id="navbar">bottom:0;でどこに配置されるか？</div>
改行<br>改行<br>改行<br>改行<br>改行<br>改行<br>改行<br>……以下略
</body>
上の例だと、Netscape・Operaはスクロールしないと最下部の#navbarは見えてこない。
しかしWinIEはページの高さに関係なく最初からウィンドウの最下部に表示され、
スクロールすると一緒に上に移って見えなくなる。
あ、ごめん。「ウィンドウ（表示領域）」と書いたけど、「閲覧領域」が正しいかな。
たびたびすみません。>>771は既出でしたね。ごめんなさい。
閲覧領域のサイズを初期コンテナブロックのサイズとして扱う
http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
閲覧領域のサイズを初期コンテナブロックのサイズとして扱う
http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
774 ：Name_Not_Found：04/02/05 17:41 ID:???
閲覧領域のサイズを初期コンテナブロックのサイズとして扱う
http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
>幅や高さを明示していない初期コンテナブロックに対して絶対配置する要素
>は、閲覧領域に対して配置されてしまう。
初期コンテナブロックって、IE標準モードではhtml要素、互換モードではbody要素ですよね？
でも、html, body {height:3000px;width:800px;}とか指定して
幅や高さを明示しても、やはり閲覧領域に対して配置されるままなんですけど。
>>595にも、「html {height:100%;}では表示は変化しなかった」とあります。
http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
>幅や高さを明示していない初期コンテナブロックに対して絶対配置する要素
>は、閲覧領域に対して配置されてしまう。
初期コンテナブロックって、IE標準モードではhtml要素、互換モードではbody要素ですよね？
でも、html, body {height:3000px;width:800px;}とか指定して
幅や高さを明示しても、やはり閲覧領域に対して配置されるままなんですけど。
>>595にも、「html {height:100%;}では表示は変化しなかった」とあります。
775 ：Name_Not_Found：04/02/05 22:55 ID:???
delとins要素だけmarginの算出方法が違うってことあります？
Mozillaでなぜか
div#body > * {
margin-left: 10%;
margin-right: 10%;
}
ってやってもinsとdelだけマージンがうまく取れないんですが。
displayがblockになってないのかなぁ。
Mozillaでなぜか
div#body > * {
margin-left: 10%;
margin-right: 10%;
}
ってやってもinsとdelだけマージンがうまく取れないんですが。
displayがblockになってないのかなぁ。
776 ：Name_Not_Found：04/02/05 23:09 ID:???
自己解決しました
div#body > *,
div#body > ins > *,
div#body > del > * {
margin-left: 10%;
margin-right: 10%;
}
でOKみたいです。insとdelってなんで特別なんだろう。
div#body > *,
div#body > ins > *,
div#body > del > * {
margin-left: 10%;
margin-right: 10%;
}
でOKみたいです。insとdelってなんで特別なんだろう。
ああ、すいません、リロードしないで書き込んでしまいました。
>>776のことは知っていますが、文脈上中にp要素が入っているので
ブロック要素ととしてレンダリングされるべきだと思うのですが、
<div id="body">
<p>foo</p>
<ins><p>bar</p></ins>
<pre>hoge</pre>
</div>
というようなソースでdivの直下のp要素やpre要素ははマージンが取られるのに
ins要素はマージンが取られないのは仕様なのかバグなのか分からなかったもので。
Operaもマージンが取られないんでどうやら私の勘違いだったようです。仕様書
読み直してきます。
>>776のことは知っていますが、文脈上中にp要素が入っているので
ブロック要素ととしてレンダリングされるべきだと思うのですが、
<div id="body">
<p>foo</p>
<ins><p>bar</p></ins>
<pre>hoge</pre>
</div>
というようなソースでdivの直下のp要素やpre要素ははマージンが取られるのに
ins要素はマージンが取られないのは仕様なのかバグなのか分からなかったもので。
Operaもマージンが取られないんでどうやら私の勘違いだったようです。仕様書
読み直してきます。
779 ：Name_Not_Found：04/02/06 22:18 ID:???
DHTML【Netscape7.1 Quirksモード】
ページ内にHR要素があると、スクロール後にそれがチカチカ小刻みに点滅する。
http://pc2.2ch.net/test/read.cgi/hp/1075096787/348-353 参照。
var DOM=document.getElementById;
function always() {
if (DOM) {document.getElementsByTagName('body')[0].style.marginBottom='5em';};
}
if(DOM) {setInterval("always()",50);} // 5秒毎
strictモードでは問題ない。対処法は、わからない。
ページ内にHR要素があると、スクロール後にそれがチカチカ小刻みに点滅する。
http://pc2.2ch.net/test/read.cgi/hp/1075096787/348-353 参照。
var DOM=document.getElementById;
function always() {
if (DOM) {document.getElementsByTagName('body')[0].style.marginBottom='5em';};
}
if(DOM) {setInterval("always()",50);} // 5秒毎
strictモードでは問題ない。対処法は、わからない。
780 ：Name_Not_Found：04/02/06 22:26 ID:???
779追記
document.getElementsByTagNameでスタイル変更するのがbody要素以外だと
点滅バグは起きないみたい。
それにしてもナゼ関係のないHRに影響が出るのやら。
document.getElementsByTagNameでスタイル変更するのがbody要素以外だと
点滅バグは起きないみたい。
それにしてもナゼ関係のないHRに影響が出るのやら。
781 ：Name_Not_Found：04/02/06 22:31 ID:???
782 ：Name_Not_Found：04/02/06 23:21 ID:???
>>781
常にインラインとしてレンダリングってのは既出だね。↓
http://cssbug.at.infoseek.co.jp/detail/mozilla/b042.html
でも、hr{display:block;}を指定しても>>779-780バグは解消しない。
常にインラインとしてレンダリングってのは既出だね。↓
http://cssbug.at.infoseek.co.jp/detail/mozilla/b042.html
でも、hr{display:block;}を指定しても>>779-780バグは解消しない。
784 ：Name_Not_Found：04/02/07 00:31 ID:???
実体参照で表記した文字が正しく表示されない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
このWinIEバグ、Opera7.23（Win98SE）でも起こる場合がある。
但し文字化けはしない。何も表示されずそこが空白になる。
BODY{
font-family:'文字鏡契冲明朝','CX古典ミン-R','癸羊明朝',MingLiu,"ＭＳ 明朝", 'ヒラギノ明朝 Pro W3',"平成明朝", Micho, serif;
}
.unicode {font-family:/*'Lucida Sans Unicode'*/,'Arial Unicode MS', "ＭＳ 明朝", "平成明朝", Micho, serif;}
<p><span class="unicode">絓</span>秀実によれば……</p>
上記のソースで'文字鏡契冲明朝'をコメント・アウトするとバグは起きなくなる。
'文字鏡契冲明朝'を持ってないパソコンでもバグは起きないはず。
つまり特定のフォントを親要素に指定してる場合だけ、.unicodeが上書きできなくなるわけ。
Opera以外のNetscape7やIE6ではこのバグは起きず、ちゃんと文字が表示された。
「文字鏡契冲」とは
http://www5a.biglobe.ne.jp/~keichu/mojikeichu.htm
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
このWinIEバグ、Opera7.23（Win98SE）でも起こる場合がある。
但し文字化けはしない。何も表示されずそこが空白になる。
BODY{
font-family:'文字鏡契冲明朝','CX古典ミン-R','癸羊明朝',MingLiu,"ＭＳ 明朝", 'ヒラギノ明朝 Pro W3',"平成明朝", Micho, serif;
}
.unicode {font-family:/*'Lucida Sans Unicode'*/,'Arial Unicode MS', "ＭＳ 明朝", "平成明朝", Micho, serif;}
<p><span class="unicode">絓</span>秀実によれば……</p>
上記のソースで'文字鏡契冲明朝'をコメント・アウトするとバグは起きなくなる。
'文字鏡契冲明朝'を持ってないパソコンでもバグは起きないはず。
つまり特定のフォントを親要素に指定してる場合だけ、.unicodeが上書きできなくなるわけ。
Opera以外のNetscape7やIE6ではこのバグは起きず、ちゃんと文字が表示された。
「文字鏡契冲」とは
http://www5a.biglobe.ne.jp/~keichu/mojikeichu.htm
785 ：Name_Not_Found：04/02/07 00:33 ID:???
HTMLソースを訂正。↓
<p><span class="unicode">絓</span>秀実によれば……</p>
<p><span class="unicode">絓</span>秀実によれば……</p>
786 ：Name_Not_Found：04/02/07 00:44 ID:???
>>784のバグは、ページの文字コードを
<meta http-equiv="Content-Type" content="text/html; charset=Shift_jis">
を
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
にして、UTF-8で再保存しておいてから、
表示＞エンコード＞UnicodeでUTF-8を選択すると起きない。
但しページの文字コードをUTF-8にしておいても、エンコード＞「自動選択」だと
やはり実体参照した所だけ空白になる。
<meta http-equiv="Content-Type" content="text/html; charset=Shift_jis">
を
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
にして、UTF-8で再保存しておいてから、
表示＞エンコード＞UnicodeでUTF-8を選択すると起きない。
但しページの文字コードをUTF-8にしておいても、エンコード＞「自動選択」だと
やはり実体参照した所だけ空白になる。
787 ：Name_Not_Found：04/02/07 19:00 ID:???
>>770のOperaバグをDHTMLで解消してみようとした。
すると、新たなバグ（？）が……。
<script type="text/javascript"><!--
var DOM=document.getElementById;
var Opera=(navigator.userAgent.indexOf("Opera")!=-1 && DOM)?1:0;
function alwaysBottom() {
object = document.getElementById('navbar').style;
BCH = document.body.clientHeight;
objH = document.getElementById('navbar').offsetHeight;
if(Opera && object.position!=='static') {
object.position='fixed'; object.top=BCH-objH;
};
if (Opera) document.getElementsByTagName('body')[0].style.marginBottom=objH;
}
if(Opera) {setInterval("alwaysBottom()",50);} //5秒毎
//--></script>
<STYLE type="text/css"><!--
#navbar {z-index:5; left:0;right:0; margin-bottom:0;}
--></STYLE>
これでposition:fixed;bottom:0;を再現できて問題なかったが、
スクロールを一番下まで持ってきた場合だけ#navbar内のリンク・アンカーが効かなくなった。
原因は外部シートで指定してたこれ。↓
body {position:relative;top:0;left:0;z-index:0;}/*NN6.1以降のz-indexマイナス値対策*/
z-index:0;をコメントアウトするか#navbarと同じz-index:5;にするとリンクは有効に戻った。
同じスクリプトをNetscape7に適用しても、このOpera7.23みたいな不具合は起きなかった。
バグではないかもしれないが、一応。
すると、新たなバグ（？）が……。
<script type="text/javascript"><!--
var DOM=document.getElementById;
var Opera=(navigator.userAgent.indexOf("Opera")!=-1 && DOM)?1:0;
function alwaysBottom() {
object = document.getElementById('navbar').style;
BCH = document.body.clientHeight;
objH = document.getElementById('navbar').offsetHeight;
if(Opera && object.position!=='static') {
object.position='fixed'; object.top=BCH-objH;
};
if (Opera) document.getElementsByTagName('body')[0].style.marginBottom=objH;
}
if(Opera) {setInterval("alwaysBottom()",50);} //5秒毎
//--></script>
<STYLE type="text/css"><!--
#navbar {z-index:5; left:0;right:0; margin-bottom:0;}
--></STYLE>
これでposition:fixed;bottom:0;を再現できて問題なかったが、
スクロールを一番下まで持ってきた場合だけ#navbar内のリンク・アンカーが効かなくなった。
原因は外部シートで指定してたこれ。↓
body {position:relative;top:0;left:0;z-index:0;}/*NN6.1以降のz-indexマイナス値対策*/
z-index:0;をコメントアウトするか#navbarと同じz-index:5;にするとリンクは有効に戻った。
同じスクリプトをNetscape7に適用しても、このOpera7.23みたいな不具合は起きなかった。
バグではないかもしれないが、一応。
788 ：Name_Not_Found：04/02/07 19:42 ID:???
>>787から
if (Opera) document.getElementsByTagName('body')[0].style.marginBottom=objH;
を削ると、Opera7.23でも問題は起きなくなる。
但し>>779-780のMozillaバグと違ってbody要素へのスタイル指定でもmarginBottom以外では問題ナシ。
従って、削った行の代りに
if (DOM && !N6) document.body.style.paddingBottom=objH;
とすれば意図通りの表示でバグも回避された。
if (Opera) document.getElementsByTagName('body')[0].style.marginBottom=objH;
を削ると、Opera7.23でも問題は起きなくなる。
但し>>779-780のMozillaバグと違ってbody要素へのスタイル指定でもmarginBottom以外では問題ナシ。
従って、削った行の代りに
if (DOM && !N6) document.body.style.paddingBottom=objH;
とすれば意図通りの表示でバグも回避された。
789 ：Name_Not_Found：04/02/07 21:40 ID:???
【Netscape7.1】
入れ子になったリスト要素でlist-style-image:none; を無視する。
cf. http://cssbug.at.infoseek.co.jp/detail/opera/b012.html
#nest ul {list-style-image:url(image.gif);}
と指定しておいてから、以下の４通りの上書きを試みた。
#nest ul ul {list-style-image:none;}/*これは無視しない、有効*/
#nest ul li {list-style-image:none;}/*これも有効*/
#nest li ul {list-style-image:none;}/*これが無効*/
#nest li li {list-style-image:none;}/*これも無効*/
<div id="nest">
<ul>
<li>その１
<ul><li>その1.5</li></ul>
</li>
<li>その２</li>
</ul>
</div>
念の為、インライン・スタイルシートで入れ子の中のulやliに
<ul style="list-style-image:none;">
<li style="list-style-image:none;">
と直に指定すると、どちらも有効だった。
ナニコレ？
入れ子になったリスト要素でlist-style-image:none; を無視する。
cf. http://cssbug.at.infoseek.co.jp/detail/opera/b012.html
#nest ul {list-style-image:url(image.gif);}
と指定しておいてから、以下の４通りの上書きを試みた。
#nest ul ul {list-style-image:none;}/*これは無視しない、有効*/
#nest ul li {list-style-image:none;}/*これも有効*/
#nest li ul {list-style-image:none;}/*これが無効*/
#nest li li {list-style-image:none;}/*これも無効*/
<div id="nest">
<ul>
<li>その１
<ul><li>その1.5</li></ul>
</li>
<li>その２</li>
</ul>
</div>
念の為、インライン・スタイルシートで入れ子の中のulやliに
<ul style="list-style-image:none;">
<li style="list-style-image:none;">
と直に指定すると、どちらも有効だった。
ナニコレ？
790 ：Name_Not_Found：04/02/07 21:44 ID:???
>>789に追記。
#nest ul li ul {list-style-image:none;}/*これも無効*/
#nest ul li li {list-style-image:none;}/*これも無効*/
#nest ul li ul li {list-style-image:none;}/*これも無効*/
#nest ul li ul {list-style-image:none;}/*これも無効*/
#nest ul li li {list-style-image:none;}/*これも無効*/
#nest ul li ul li {list-style-image:none;}/*これも無効*/
791 ：Name_Not_Found：04/02/07 21:55 ID:???
>>789-790
同様にして、list-style-type:none;等も効かないみたい。
入れ子リストで外側のliをセレクタに入れると効かなくなる？
この未確認バグ↓の再現条件なのかも。
http://cssbug.at.infoseek.co.jp/detail/mozilla/b010.html
同様にして、list-style-type:none;等も効かないみたい。
入れ子リストで外側のliをセレクタに入れると効かなくなる？
この未確認バグ↓の再現条件なのかも。
http://cssbug.at.infoseek.co.jp/detail/mozilla/b010.html
792 ：Name_Not_Found：04/02/08 01:24 ID:???
>>770は再現しなかったからか未確認バグの方に登録されましたね。
bottom:0;配置した要素内で折り返された文字列が閲覧領域外に隠れる(7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b077.html
再現条件がつかめました。かなり微妙です。
上掲URLのページをそのままOperaでローカルに保存、ソースを開いて、
head内に下記を追加しました。
<STYLE type="text/css"><!--
body {position:relative;top:0;left:0;z-index:0;}/* >>787と同じ */
--></STYLE>
さらにheadかbody中の任意の箇所に下記１行を追加します。
<script TYPE="text/javascript" src="./abcdefghijklmn.js"></script>
これは存在しないjsファイルで結構です。
すると、あら不思議、>>770のバグが再現しました。
但し、再読込（リロード）すると再現しない。一度どこか別のページを表示してから
この保存して追記したページを表示させると、バグが発現します。わけわからん。
bottom:0;配置した要素内で折り返された文字列が閲覧領域外に隠れる(7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b077.html
再現条件がつかめました。かなり微妙です。
上掲URLのページをそのままOperaでローカルに保存、ソースを開いて、
head内に下記を追加しました。
<STYLE type="text/css"><!--
body {position:relative;top:0;left:0;z-index:0;}/* >>787と同じ */
--></STYLE>
さらにheadかbody中の任意の箇所に下記１行を追加します。
<script TYPE="text/javascript" src="./abcdefghijklmn.js"></script>
これは存在しないjsファイルで結構です。
すると、あら不思議、>>770のバグが再現しました。
但し、再読込（リロード）すると再現しない。一度どこか別のページを表示してから
この保存して追記したページを表示させると、バグが発現します。わけわからん。
793 ：Name_Not_Found：04/02/08 02:35 ID:???
794 ：Name_Not_Found：04/02/08 05:22 ID:5+p0Jns4
http://pc2.2ch.net/test/read.cgi/hp/1074845459/684n
多分IEのバグだと思うし辞典にも未登録だと思う（背景で一覧検索しても
なかった）が「仕様規定外」かもしれないので辞典スレでなくて先にこちらへ
・確認したのはIE6標準モード
インライン要素へ背景画像を指定して repeat-x 表示させた時，
そのインライン要素が2行にまたがる場合に2行目（折り返した後の部分）の
背景が表示されない
Moz1.6とOpera7.23では全部表示される
例：
p { width: 7em; } /* 単に折り返させるためだけに指定 */
em { background: url(wave.png) repeat-x; } /* wave.png は10px*3pxの画像 */
<p><em>あいうえおかきくけこ</em><em>あいうえおかきくけこ</em></p>
例えばブラウザのレンダリングが
｜あいうえおかき
｜くけこ あいう
｜えおかきくけこ
（縦棒は見易さのため）となる場合，IEでは2行目の「くけこ」と3行目の
「えおかきくけこ」の背景が表示されない
また，backgroundの指定にbottomを追加する（本来インライン要素では
background-positionは指定できないが，やってみる）と
IE6では今度は「折り返す前の部分」の背景が表示されなくなる
MozとOperaでは表示される（なお，いずれのブラウザでもbottomに表示してくれる）
やりたかったのは強調語句に（画像で）下波線を引きたかったんだけど
インラインのbg-positionは本来指定できないならバグだろうとなかろうとダメだな
（ブラウザがよきに計らってくれてるから指定しておくという考えもアリかも）
多分IEのバグだと思うし辞典にも未登録だと思う（背景で一覧検索しても
なかった）が「仕様規定外」かもしれないので辞典スレでなくて先にこちらへ
・確認したのはIE6標準モード
インライン要素へ背景画像を指定して repeat-x 表示させた時，
そのインライン要素が2行にまたがる場合に2行目（折り返した後の部分）の
背景が表示されない
Moz1.6とOpera7.23では全部表示される
例：
p { width: 7em; } /* 単に折り返させるためだけに指定 */
em { background: url(wave.png) repeat-x; } /* wave.png は10px*3pxの画像 */
<p><em>あいうえおかきくけこ</em><em>あいうえおかきくけこ</em></p>
例えばブラウザのレンダリングが
｜あいうえおかき
｜くけこ あいう
｜えおかきくけこ
（縦棒は見易さのため）となる場合，IEでは2行目の「くけこ」と3行目の
「えおかきくけこ」の背景が表示されない
また，backgroundの指定にbottomを追加する（本来インライン要素では
background-positionは指定できないが，やってみる）と
IE6では今度は「折り返す前の部分」の背景が表示されなくなる
MozとOperaでは表示される（なお，いずれのブラウザでもbottomに表示してくれる）
やりたかったのは強調語句に（画像で）下波線を引きたかったんだけど
インラインのbg-positionは本来指定できないならバグだろうとなかろうとダメだな
（ブラウザがよきに計らってくれてるから指定しておくという考えもアリかも）
795 ：Name_Not_Found：04/02/08 09:10 ID:???
DHTML／NN4.75（Win）
<script TYPE="text/javascript" charset="Shift_JIS" src="abc.js"></script>
<div id="idA">
なんたらかんたら
</div>
これを、
<div id="idA">
<script TYPE="text/javascript" charset="Shift_JIS" src="abc.js"></script>
なんたらかんたら
</div>
と順番入換したら、NN4.7だけスクリプトが動作しなくなった。
スクリプトから抜萃すると、
var NN4=(document.layers)?1:0;
var IE=(document.all)?1:0;
function posit(){
object=NN4?document.idA:IE?idA.style:document.getElementById('idA').style;
……
}
バグではないのかもしれないが、不都合だ。
<script TYPE="text/javascript" charset="Shift_JIS" src="abc.js"></script>
<div id="idA">
なんたらかんたら
</div>
これを、
<div id="idA">
<script TYPE="text/javascript" charset="Shift_JIS" src="abc.js"></script>
なんたらかんたら
</div>
と順番入換したら、NN4.7だけスクリプトが動作しなくなった。
スクリプトから抜萃すると、
var NN4=(document.layers)?1:0;
var IE=(document.all)?1:0;
function posit(){
object=NN4?document.idA:IE?idA.style:document.getElementById('idA').style;
……
}
バグではないのかもしれないが、不都合だ。
796 ：Name_Not_Found：04/02/08 23:34 ID:???
@m, @i, !iがキーワードとして有効(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b137.html
これと似たWinIEバグ（？）。
IE のファジー解釈
http://www2.u-netsurf.ne.jp/~alt/mt/archives/20040127_0139.html
>a:activ{color:green;}
>a:acti{color:green;}
>a:a{color:green;}
>これでも a:active ということにしてくださるのですね、Internet Explorer さんは。
>負けました。
「@i でインポート」
http://altba.com/bakera/hatomaru.aspx/htmlbbs/inthread/1350
http://cssbug.at.infoseek.co.jp/detail/winie/b137.html
これと似たWinIEバグ（？）。
IE のファジー解釈
http://www2.u-netsurf.ne.jp/~alt/mt/archives/20040127_0139.html
>a:activ{color:green;}
>a:acti{color:green;}
>a:a{color:green;}
>これでも a:active ということにしてくださるのですね、Internet Explorer さんは。
>負けました。
「@i でインポート」
http://altba.com/bakera/hatomaru.aspx/htmlbbs/inthread/1350
797 ：Name_Not_Found：04/02/09 04:03 ID:???
>>789-791は取り消し。
こちらがHTMLを間違って書いてました。ごめん。
こちらがHTMLを間違って書いてました。ごめん。
798 ：Name_Not_Found：04/02/09 07:00 ID:???
>>779-780のMozilla Quirksモードのバグは以下のスクリプトで再現した。
外部シートで #navbar {position:fixed;bottom:0;} としておいてから――
var D=document;
var DOM=document.getElementById;
var Opera=(navigator.userAgent.indexOf("Opera")!=-1 && DOM)?1:0;
var IE6s=((navigator.appVersion.indexOf("MSIE 6")>-1) && D.compatMode=="CSS1Compat")?1:0;
var IE=(D.all && !Opera)?1:0;
var N6=(DOM && !D.all && !Opera)?1:0;
var NN4=(D.layers && !DOM)?1:0;
function alwaysBottom() {
object=NN4?document.navbar:IE?navbar.style:D.getElementById('navbar').style;
var top=IE?"pixelTop":"top";
var Body =IE6s?D.documentElement:D.body;
newY=IE?Body.scrollTop:window.pageYOffset;
objH = NN4?0:IE?navbar.offsetHeight:D.getElementById('navbar').offsetHeight;
BH = NN4?0:Body.clientHeight;//:!NN4?Body.innerHeight:0
objY = newY + BH - objH;
var unit=(!N6)?'':'px';
if(!NN4){D.body.style.paddingBottom=objH;};/*これが原因！ 問題の行*/
if (newY>-1 && !N6) {NN4?object[top]=newY:IE?object[top]=objY+unit:object.top=BH-objH;};
if(!IE && object.position!=='static'){object.position='fixed'; };
}
if(NN4||IE||DOM) {setInterval("alwaysBottom()",50);}
問題の行を消せばHRの点滅するバグは起きなくなる
しかし、問題の行を切取りして３行前に挿入し直しても、なぜかバグは起きない。謎。
外部シートで #navbar {position:fixed;bottom:0;} としておいてから――
var D=document;
var DOM=document.getElementById;
var Opera=(navigator.userAgent.indexOf("Opera")!=-1 && DOM)?1:0;
var IE6s=((navigator.appVersion.indexOf("MSIE 6")>-1) && D.compatMode=="CSS1Compat")?1:0;
var IE=(D.all && !Opera)?1:0;
var N6=(DOM && !D.all && !Opera)?1:0;
var NN4=(D.layers && !DOM)?1:0;
function alwaysBottom() {
object=NN4?document.navbar:IE?navbar.style:D.getElementById('navbar').style;
var top=IE?"pixelTop":"top";
var Body =IE6s?D.documentElement:D.body;
newY=IE?Body.scrollTop:window.pageYOffset;
objH = NN4?0:IE?navbar.offsetHeight:D.getElementById('navbar').offsetHeight;
BH = NN4?0:Body.clientHeight;//:!NN4?Body.innerHeight:0
objY = newY + BH - objH;
var unit=(!N6)?'':'px';
if(!NN4){D.body.style.paddingBottom=objH;};/*これが原因！ 問題の行*/
if (newY>-1 && !N6) {NN4?object[top]=newY:IE?object[top]=objY+unit:object.top=BH-objH;};
if(!IE && object.position!=='static'){object.position='fixed'; };
}
if(NN4||IE||DOM) {setInterval("alwaysBottom()",50);}
問題の行を消せばHRの点滅するバグは起きなくなる
しかし、問題の行を切取りして３行前に挿入し直しても、なぜかバグは起きない。謎。
799 ：Name_Not_Found：04/02/09 14:18 ID:rKAW/aKl
trのborderって変えられないの？
800 ：Name_Not_Found：04/02/09 21:39 ID:???
801 ：Name_Not_Found：04/02/10 10:32 ID:3qJHTSJD
>>800
それはバグなんですか、仕様なんですか。
それはバグなんですか、仕様なんですか。
802 ：Name_Not_Found：04/02/10 10:44 ID:???
仕様書読めば。
803 ：Name_Not_Found：04/02/10 10:52 ID:???
仕様書読んであげれば。
804 ：Name_Not_Found：04/02/10 11:30 ID:???
読んであげれば。
805 ：Name_Not_Found：04/02/10 11:39 ID:???
他力本願みっともない。
806 ：Name_Not_Found：04/02/10 11:47 ID:???
>>801
自力本願
自力本願
807 ：Name_Not_Found：04/02/10 11:51 ID:???
CSS2対応状況ガイド：border-collapse
http://www.zspc.com/documents/css2/table/collapse.html
テーブル関連のプロパティ対応状況
border-collapse
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/tables.html#border-collapse
http://www.zspc.com/documents/css2/table/collapse.html
テーブル関連のプロパティ対応状況
border-collapse
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/tables.html#border-collapse
808 ：Name_Not_Found：04/02/10 13:32 ID:???
【Opera7.23 Strictモード】
box-sizing:border-box;を組み合せるとバグ
cf. http://cssbug.at.infoseek.co.jp/detail/opera/b040.html
初めに、div {box-sizing:border-box;}と指定済みだとする。
div#menu {position:fixed; bottom:0;}
これは下記のDHTMLでtop値を付与したとき同じ表現になる。
var DOM=document.getElementById;
var Opera=(navigator.userAgent.indexOf("Opera")!=-1 && DOM)?1:0;
var N6=(DOM && !document.all && !Opera)?1:0;
if(DOM) {setInterval("alwaysBottom()",50);/*bodyタグ内に書き込む手間を省く*/
function alwaysBottom() {
object=document.getElementById('menu').style;
objH = document.getElementById('menu').offsetHeight;
var unit=(!N6)?'':'px';///*N6strictモード単位必須
if (DOM) {object.position='fixed'; object.top=BH-objH+unit;}
}
ところがこの関数最終行に追記して
if (DOM) {object.position='fixed'; object.top=BH-objH+unit; object.bottom='0';}
とするか、スタイルシートで#menu {bottom:0;}と指定してあるかすると、
オブジェクトdiv#menuが少しづつ動いて画面外に消え去る。
この不具合はOpera7.23でもStrictモードだけで起こり、
Quirksモードでは消え去ってゆかず、ちゃんと閲覧領域底辺に固定されたまま。
MozillaではStrictでもTransitionalでもそんなことは起らない。
setIntervalの代りにsetTimeoutで関数を実行させるとなぜかバグは生じない。
if(DOM) setTimeout("alwaysBottom()",50);
また、これらを使用せずに、ただ
if(DOM) {window.onload = posit;}
function posit(){//……変数定義省略
object.position='fixed'; object.top=BH-objH+unit; object.bottom='0';
}
としても、このバグは起きない。
box-sizing:border-box;を組み合せるとバグ
cf. http://cssbug.at.infoseek.co.jp/detail/opera/b040.html
初めに、div {box-sizing:border-box;}と指定済みだとする。
div#menu {position:fixed; bottom:0;}
これは下記のDHTMLでtop値を付与したとき同じ表現になる。
var DOM=document.getElementById;
var Opera=(navigator.userAgent.indexOf("Opera")!=-1 && DOM)?1:0;
var N6=(DOM && !document.all && !Opera)?1:0;
if(DOM) {setInterval("alwaysBottom()",50);/*bodyタグ内に書き込む手間を省く*/
function alwaysBottom() {
object=document.getElementById('menu').style;
objH = document.getElementById('menu').offsetHeight;
var unit=(!N6)?'':'px';///*N6strictモード単位必須
if (DOM) {object.position='fixed'; object.top=BH-objH+unit;}
}
ところがこの関数最終行に追記して
if (DOM) {object.position='fixed'; object.top=BH-objH+unit; object.bottom='0';}
とするか、スタイルシートで#menu {bottom:0;}と指定してあるかすると、
オブジェクトdiv#menuが少しづつ動いて画面外に消え去る。
この不具合はOpera7.23でもStrictモードだけで起こり、
Quirksモードでは消え去ってゆかず、ちゃんと閲覧領域底辺に固定されたまま。
MozillaではStrictでもTransitionalでもそんなことは起らない。
setIntervalの代りにsetTimeoutで関数を実行させるとなぜかバグは生じない。
if(DOM) setTimeout("alwaysBottom()",50);
また、これらを使用せずに、ただ
if(DOM) {window.onload = posit;}
function posit(){//……変数定義省略
object.position='fixed'; object.top=BH-objH+unit; object.bottom='0';
}
としても、このバグは起きない。
809 ：Name_Not_Found：04/02/10 14:55 ID:???
>>808
http://pc2.2ch.net/test/read.cgi/hp/1075096787/488-489n
結論だけ言うと、offsetHeightの算出法がStrictモード時に他のUAと違うことが原因。
ただoffsetHeightはもともときちんと標準化されたプロパティではないので
バグとみなすには無理があるだろう。
http://pc2.2ch.net/test/read.cgi/hp/1075096787/488-489n
結論だけ言うと、offsetHeightの算出法がStrictモード時に他のUAと違うことが原因。
ただoffsetHeightはもともときちんと標準化されたプロパティではないので
バグとみなすには無理があるだろう。
810 ：Name_Not_Found：04/02/11 01:36 ID:???
WinIE6にて。
#id {position:absolute; position:fixed; top:50px; left:0;}
これはposition:fixed;（未実装）に上書きされてposition:absolute;は無効になる。
したがってtop:50px;も効かない。
IE独自拡張のCSS関数構文を使って同じ事を指定してみる。
#id {position:expression('absolute'); position:fixed; top:50px; left:0;}
これだとposition:absolute;として有効、top:50px;に配置される。
なんかヘンですね。
#id {position:absolute; position:fixed; top:50px; left:0;}
これはposition:fixed;（未実装）に上書きされてposition:absolute;は無効になる。
したがってtop:50px;も効かない。
IE独自拡張のCSS関数構文を使って同じ事を指定してみる。
#id {position:expression('absolute'); position:fixed; top:50px; left:0;}
これだとposition:absolute;として有効、top:50px;に配置される。
なんかヘンですね。
Safariでpositionとかbackground-colorが効いてないとか言ってた者ですが、
自分のCSSを眺めていたら記述ミスに気付きました。
.Navi {
margin: 1em auto;
test-align: center; // IE用 ←
}
/* 昔の癖でコメント記述を間違えてました。Safariは文法エラーが起こると
それ以後全ての宣言を無視するようです。ブロックの最後尾にあったので
MozillaやIEでは影響が出ず、気付いてませんでした。修正したらちゃんと
表示されました…。鬱。 */
自分のCSSを眺めていたら記述ミスに気付きました。
.Navi {
margin: 1em auto;
test-align: center; // IE用 ←
}
/* 昔の癖でコメント記述を間違えてました。Safariは文法エラーが起こると
それ以後全ての宣言を無視するようです。ブロックの最後尾にあったので
MozillaやIEでは影響が出ず、気付いてませんでした。修正したらちゃんと
表示されました…。鬱。 */
2重にミスってさらに鬱。text-alignでつ。
813 ：Name_Not_Found：04/02/13 07:10 ID:???
bottom:0;配置した要素内で折り返された文字列が隠れる(7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b077.html
>プログレスバーをページの下部にポップアップ表示させる設定にしているとき、
>ページの末尾までスクロールさせてから再読み込みをすると
この条件は、成立の要件ではないみたいよ。>>792の通り、そのまま保存したページに
<script TYPE="text/javascript" src="./abcdefghijklmn.js"></script>
の一行を挿入してから、いっぺんどこか別のページを表示したあと
この保存して追記したページを表示させると、バグが発現した。
この場合、再読み込みではバグは起らなくなる。
しかもページの末尾までスクロールさせなくても、常に文字列の下半分が隠れたまま。
プログレスバーを表示させない設定にしても、同じ結果だった。
折り返されない文字列でも下半分が隠れる場合があるね。
ここ↓をOpera7.23で見ると、「右下」の字の上半分しか見えない。
http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
プログレスバーを表示させない設定にしても、同じ結果だった。
まあこれは表示倍率を90%から100%にしたら直ったけど。
http://cssbug.at.infoseek.co.jp/detail/opera/b077.html
>プログレスバーをページの下部にポップアップ表示させる設定にしているとき、
>ページの末尾までスクロールさせてから再読み込みをすると
この条件は、成立の要件ではないみたいよ。>>792の通り、そのまま保存したページに
<script TYPE="text/javascript" src="./abcdefghijklmn.js"></script>
の一行を挿入してから、いっぺんどこか別のページを表示したあと
この保存して追記したページを表示させると、バグが発現した。
この場合、再読み込みではバグは起らなくなる。
しかもページの末尾までスクロールさせなくても、常に文字列の下半分が隠れたまま。
プログレスバーを表示させない設定にしても、同じ結果だった。
折り返されない文字列でも下半分が隠れる場合があるね。
ここ↓をOpera7.23で見ると、「右下」の字の上半分しか見えない。
http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
プログレスバーを表示させない設定にしても、同じ結果だった。
まあこれは表示倍率を90%から100%にしたら直ったけど。
814 ：晒し：04/02/13 07:14 ID:InFAFPWN
http://www.nurs.or.jp/caution.html
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
正しい取り引きがされる限りは、たとえ麻薬の売買だろうが売買春だ ろうが構いませんが、
815 ：Name_Not_Found：04/02/13 08:09 ID:???
実体参照で表記した文字が正しく表示されない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
＞2004-02-13修正。例示を修正。
例示のうち、二番目・三番目は既出である別のバグに属してやしないかな？
フォントの総称ファミリに不適切なフォントが割り当てられる(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b033.html
問題は、例示の一番目ではないかと。
<li style="font-family:'Lucida Sans Unicode',sans-serif;">Lucida 絓</li>
ユニコード・フォントである'Lucida Sans Unicode'を指定したのに文字化けとはこれ如何に。
それに、もともと>>570で提出された問題は、さらに続けて'Arial Unicode MS'を
指定するかしないかで文字化けが起ったり起らなかったりするものでしょ？
（# http://cssbug.at.infoseek.co.jp/detail/winie.html でこのバグを[2-570]としてるのは[3-570]が正しい。）
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
＞2004-02-13修正。例示を修正。
例示のうち、二番目・三番目は既出である別のバグに属してやしないかな？
フォントの総称ファミリに不適切なフォントが割り当てられる(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b033.html
問題は、例示の一番目ではないかと。
<li style="font-family:'Lucida Sans Unicode',sans-serif;">Lucida 絓</li>
ユニコード・フォントである'Lucida Sans Unicode'を指定したのに文字化けとはこれ如何に。
それに、もともと>>570で提出された問題は、さらに続けて'Arial Unicode MS'を
指定するかしないかで文字化けが起ったり起らなかったりするものでしょ？
（# http://cssbug.at.infoseek.co.jp/detail/winie.html でこのバグを[2-570]としてるのは[3-570]が正しい。）
816 ：Name_Not_Found：04/02/14 04:32 ID:???
うちはWindows98だけど、フォントから'Lucida Sans Unicode'を削除したあとで
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
を見ても、やはり文字化けしないね。IE6です。
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
を見ても、やはり文字化けしないね。IE6です。
817 ：Name_Not_Found：04/02/14 06:21 ID:???
【IE5.0/Win98SE】
link要素でmedia属性を指定してあると、外部シート内の@mediaによる媒体の限定を無視する。
例）
--------------------------------------------------------------------
HTMLでの指定
<link rel="stylesheet" type="text/css" href="style.css"
hreflang="ja" charset="Shift_jis" media="print, screen, projection">
<!--ＮＮ４ではmedia属性にscreen以外の値を指定すれば読み飛ばされる -->
--------------------------------------------------------------------
style.cssの中身
@charset "Shift_JIS";
［…略…］
@media print{
#navigation {display:none;}
}
--------------------------------------------------------------------
結果：#navigationが消える。
link要素のmedia属性を@mediaに合せてmedia="print"とだけ指定するか、
link要素にmedia属性を全く指定しないかすれば、
外部シートでの@media指定は有効になり、印刷時には指定通り消える。
media="all"ではダメ。
cf. http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
link要素でmedia属性を指定してあると、外部シート内の@mediaによる媒体の限定を無視する。
例）
--------------------------------------------------------------------
HTMLでの指定
<link rel="stylesheet" type="text/css" href="style.css"
hreflang="ja" charset="Shift_jis" media="print, screen, projection">
<!--ＮＮ４ではmedia属性にscreen以外の値を指定すれば読み飛ばされる -->
--------------------------------------------------------------------
style.cssの中身
@charset "Shift_JIS";
［…略…］
@media print{
#navigation {display:none;}
}
--------------------------------------------------------------------
結果：#navigationが消える。
link要素のmedia属性を@mediaに合せてmedia="print"とだけ指定するか、
link要素にmedia属性を全く指定しないかすれば、
外部シートでの@media指定は有効になり、印刷時には指定通り消える。
media="all"ではダメ。
cf. http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
818 ：Name_Not_Found：04/02/14 07:41 ID:???
【IE5.01/Win98SE】
次の「未確認バグ」はWinIE5.0で確認されました。
[1-35]ダイナミックプロパティがフォーム部品に対して正しく効かない(IE5)
http://cssbug.at.infoseek.co.jp/detail/winie/b011.html
------------------------------------------------
次の「未確認バグ」は、別のバグが発現してました。
[2-6]同種要素をネストするとem単位指定の下パディングが無視される(IE5)
http://cssbug.at.infoseek.co.jp/detail/winie/b019.html
paddingどころか例示の<div class="a"><div class="a"></div></div>が
傍線も含めて全く表示されません。
親要素である<div class="example">すら表示されません。
しかも再読み込みすると、その直後の要素である
<p>1文字分のパディングを四方に設定しています。</p>
の四囲に、なぜかborderがつきます。これはそのborder-colorから察するに、
どうも直前のdiv.exampleへの指定を引き継いでしまったらしい。
子要素のdiv.aの中を空でなく何か一文字でも入れれば、表示されます。
これだと報告にある通りのバグが確認されますが、
その場合、「親要素の下パディング」だけでなく上パディングも無視されます。
<div class="a"><div class="a">の間に一文字でも入れれば親要素の上パディングは有効になり、
</div></div>の間に一文字でも入れれば親要素の下パディングは有効になります。
次の「未確認バグ」はWinIE5.0で確認されました。
[1-35]ダイナミックプロパティがフォーム部品に対して正しく効かない(IE5)
http://cssbug.at.infoseek.co.jp/detail/winie/b011.html
------------------------------------------------
次の「未確認バグ」は、別のバグが発現してました。
[2-6]同種要素をネストするとem単位指定の下パディングが無視される(IE5)
http://cssbug.at.infoseek.co.jp/detail/winie/b019.html
paddingどころか例示の<div class="a"><div class="a"></div></div>が
傍線も含めて全く表示されません。
親要素である<div class="example">すら表示されません。
しかも再読み込みすると、その直後の要素である
<p>1文字分のパディングを四方に設定しています。</p>
の四囲に、なぜかborderがつきます。これはそのborder-colorから察するに、
どうも直前のdiv.exampleへの指定を引き継いでしまったらしい。
子要素のdiv.aの中を空でなく何か一文字でも入れれば、表示されます。
これだと報告にある通りのバグが確認されますが、
その場合、「親要素の下パディング」だけでなく上パディングも無視されます。
<div class="a"><div class="a">の間に一文字でも入れれば親要素の上パディングは有効になり、
</div></div>の間に一文字でも入れれば親要素の下パディングは有効になります。
819 ：Name_Not_Found：04/02/14 08:15 ID:???
【IE5.01/Win98SE】
a:hoverをセレクタにすると { }の中に/*コメント・アウト*/以外の
如何なる文字列を書き込んでも、それが無視すべきものであっても反応する。
例）
リンク要素の親要素に{position:absolute;bottom:0;}だけ指定してある。
a:hover { 12345 }みたいに何ら意味のない記述であっても
リンクにマウス・カーソルを乗せると親tableの幅が変化して横スクロールが発生することがある。
でも空白を無くしてa:hover {12345}なら変化しなかった。
A:hover {color:red; }はバグ起らず、指定の変化のみ。
A:hover {col0or:red; }だと、無視すべきなのに、やはり変化あり。
A:hover {background:red; }ではやはり幅も変化。
シート内にはこれ以外何もスタイル指定してない。
謎だ。
a:hoverをセレクタにすると { }の中に/*コメント・アウト*/以外の
如何なる文字列を書き込んでも、それが無視すべきものであっても反応する。
例）
リンク要素の親要素に{position:absolute;bottom:0;}だけ指定してある。
a:hover { 12345 }みたいに何ら意味のない記述であっても
リンクにマウス・カーソルを乗せると親tableの幅が変化して横スクロールが発生することがある。
でも空白を無くしてa:hover {12345}なら変化しなかった。
A:hover {color:red; }はバグ起らず、指定の変化のみ。
A:hover {col0or:red; }だと、無視すべきなのに、やはり変化あり。
A:hover {background:red; }ではやはり幅も変化。
シート内にはこれ以外何もスタイル指定してない。
謎だ。
820 ：Name_Not_Found：04/02/15 00:58 ID:???
http://cssbug.at.infoseek.co.jp/misc/memo.html （cf. >>808-809 ）
>box-sizingプロパティの値によってbottom (right) プロパティの作用が異なることも原因？
<div style="position:relative; width:100px; height:100px; background:aqua;">
<div style="position:absolute; left:0; right:0; top:0; bottom:0; border:10px solid red; box-sizing:border-box; -moz-box-sizing:border-box;">B</div>
</div>
Opera標準モードでは「下ボーダー外辺と親要素の内容領域の下辺との間に常に20pxの空間が確保される」。
なんでこんなことになるのかがわからない。
box-sizingは、paddingやborderの幅も含めてwidth/heightと見做せって指定ですよね。
それが、なぜwidthは正常なのにheightだけ20px短くなるのやら。
これはこれでCSSバグとしてよいのでは？
>box-sizingプロパティの値によってbottom (right) プロパティの作用が異なることも原因？
<div style="position:relative; width:100px; height:100px; background:aqua;">
<div style="position:absolute; left:0; right:0; top:0; bottom:0; border:10px solid red; box-sizing:border-box; -moz-box-sizing:border-box;">B</div>
</div>
Opera標準モードでは「下ボーダー外辺と親要素の内容領域の下辺との間に常に20pxの空間が確保される」。
なんでこんなことになるのかがわからない。
box-sizingは、paddingやborderの幅も含めてwidth/heightと見做せって指定ですよね。
それが、なぜwidthは正常なのにheightだけ20px短くなるのやら。
これはこれでCSSバグとしてよいのでは？
821 ：Name_Not_Found：04/02/15 01:11 ID:???
Mozillaではwidthも20px短くなるわけだし。 >>820
822 ：Name_Not_Found：04/02/15 07:07 ID:???
>>817
Opera6のこのバグと相似だね。
二重にメディアを指定されたスタイルを認識しない(6.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b013.html
WinIE5.0の場合、認識すべからざるスタイルを認識したわけで、逆だが。
Opera6のこのバグと相似だね。
二重にメディアを指定されたスタイルを認識しない(6.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b013.html
WinIE5.0の場合、認識すべからざるスタイルを認識したわけで、逆だが。
823 ：Name_Not_Found：04/02/15 23:31 ID:ZKGisPv2
WinIE6.0/Win98SE
h3 { text-align : left ; margin-top : 1em ; margin-left : 7% ; margin-right : auto ; }
p { text-align : left ; margin-left : 9% ; margin-right : auto ; padding : 0.2em ; }
<h3>あいうえお</h3>
<p>かきくけこ</p>
<h3>さしすせそ</h3>
<p>たちつてと</p>
この状況下だと、最後のpがh3のマージンを継承してしまうのですが
（１，２行目は指定通りになる）、IEのバグなのでしょうか？
h3 { text-align : left ; margin-top : 1em ; margin-left : 7% ; margin-right : auto ; }
p { text-align : left ; margin-left : 9% ; margin-right : auto ; padding : 0.2em ; }
<h3>あいうえお</h3>
<p>かきくけこ</p>
<h3>さしすせそ</h3>
<p>たちつてと</p>
この状況下だと、最後のpがh3のマージンを継承してしまうのですが
（１，２行目は指定通りになる）、IEのバグなのでしょうか？
824 ：Name_Not_Found：04/02/16 06:57 ID:???
>>823
同じくWinIE6.0/Win98SEで全く再現されなかったが。
h3のどの辺のmarginを引き継ぐって？
pにもmargin-topを指定してもそれを無視するのかな。
それともmargin-left:9% ;が7%になるのかな。
後者なら僅かな差で画面上明瞭でないはずだから、もっと大きく異なった値を指定して試してみて頂戴。
他にもスタイル指定をしてないかい？
あと、{}内で空白に全角スペースを使ってはいかんよ。
同じくWinIE6.0/Win98SEで全く再現されなかったが。
h3のどの辺のmarginを引き継ぐって？
pにもmargin-topを指定してもそれを無視するのかな。
それともmargin-left:9% ;が7%になるのかな。
後者なら僅かな差で画面上明瞭でないはずだから、もっと大きく異なった値を指定して試してみて頂戴。
他にもスタイル指定をしてないかい？
あと、{}内で空白に全角スペースを使ってはいかんよ。
>>824
言葉足らずでした。
margin-leftの値を引き継いでしまいます。
(h3のmargin-leftに30%、pのmargin-leftに70%を指定しても結果は同様となりました)
あと、
h3:first-letter { color:#0000ff; font-weight:bold; }
を指定していました。
重要なところをすっかり忘れていて申し訳ないです。
で、h3のfirst-letterを外したらこの現象が治りました。
お手数かけました。
言葉足らずでした。
margin-leftの値を引き継いでしまいます。
(h3のmargin-leftに30%、pのmargin-leftに70%を指定しても結果は同様となりました)
あと、
h3:first-letter { color:#0000ff; font-weight:bold; }
を指定していました。
重要なところをすっかり忘れていて申し訳ないです。
で、h3のfirst-letterを外したらこの現象が治りました。
お手数かけました。
826 ：Name_Not_Found：04/02/17 09:51 ID:???
JavaScript について ? な挙動を見つけたので書いて見ます。
Opera 7.22 ja 、Opera 7.23 ja において
DocumentFragment オブジェクトに appendChild を繰り返すと
少ない確率で失敗するようです。
失敗したときは追加先のオブジェクトが空になります。
問題のページ (重いので注意)
ttp://maow.cside.to/FreyaG/index3.html
バグ対策をして実際に公開しているページ
ttp://maow.cside.to/FreyaG/index2.html
↑突っ込まれる前に書いておくと使い勝手に問題あるので現在改良工事中
このページでも再現しました。
ttp://members.jcom.home.ne.jp/jintrick/Personal/documentFragment.html
更にもう一つ。
JavaScript で table 要素の中に tr ・ td 要素を追加しても IE 6.0 sp1 でだけ
表示に反映されずにつまっているところです。
MozillaFirebird 0.6.1、Opera 7.23 ja では無事動作。
Opera 7.22 ja 、Opera 7.23 ja において
DocumentFragment オブジェクトに appendChild を繰り返すと
少ない確率で失敗するようです。
失敗したときは追加先のオブジェクトが空になります。
問題のページ (重いので注意)
ttp://maow.cside.to/FreyaG/index3.html
バグ対策をして実際に公開しているページ
ttp://maow.cside.to/FreyaG/index2.html
↑突っ込まれる前に書いておくと使い勝手に問題あるので現在改良工事中
このページでも再現しました。
ttp://members.jcom.home.ne.jp/jintrick/Personal/documentFragment.html
更にもう一つ。
JavaScript で table 要素の中に tr ・ td 要素を追加しても IE 6.0 sp1 でだけ
表示に反映されずにつまっているところです。
MozillaFirebird 0.6.1、Opera 7.23 ja では無事動作。
827 ：Name_Not_Found：04/02/17 09:53 ID:???
828 ：Name_Not_Found：04/02/17 10:42 ID:???
>>826
HTML 4.01 Strict のDOCTYPE宣言を記述しておきながら，
MAOW とか MAOWe とか訳わからん要素を勝手に定義するなよ。
そういうことをやりたいなら，XML応用でやりなさいよ。
HTML 4.01 Strict のDOCTYPE宣言を記述しておきながら，
MAOW とか MAOWe とか訳わからん要素を勝手に定義するなよ。
そういうことをやりたいなら，XML応用でやりなさいよ。
829 ：Name_Not_Found：04/02/17 11:36 ID:???
>>828
それも承知しています。
そのため、現在一から作り直しているところです。
以前、xml や xhtml での実装も試みたものの、
xhtml を IE にうまく認識させられなかったことと
Opera が xsl に対応していないことから当時あきらめました。
それも承知しています。
そのため、現在一から作り直しているところです。
以前、xml や xhtml での実装も試みたものの、
xhtml を IE にうまく認識させられなかったことと
Opera が xsl に対応していないことから当時あきらめました。
830 ：Name_Not_Found：04/02/18 00:37 ID:H5ggR5fN
win98、NN6と7の環境でfont-sizeとfont-weightを一緒に使うと
テーブルからはみ出てしまうみたいなんですが
これはバグですか？
<STYLE TYPE="text/css">
<!--
.article {
font-size: 14px;
font-weight: bold;
}
-->
</STYLE>
<TABLE WIDTH="408" BORDER="0" CELLSPACING="0" CELLPADDING="1">
<TR>
<TD WIDTH="406" BGCOLOR="#333333"><TABLE WIDTH="406" BORDER="0" CELLSPACING="0" CELLPADDING="5">
<TR>
<TD BGCOLOR="#FFFFFF">
<DIV CLASS="article">ブラジルのインテルナシオナル、サンパウロ、フラメンゴと名門クラブを渡り歩き、95年に現役ブラジル代表の肩書きを引っさげ入団、セレッソ大阪を支えた現役ブラジル代表ゴールキーパー、ジルマールを特集!</DIV></TD>
</TR>
</TABLE></TD>
</TR>
</TABLE>
テーブルからはみ出てしまうみたいなんですが
これはバグですか？
<STYLE TYPE="text/css">
<!--
.article {
font-size: 14px;
font-weight: bold;
}
-->
</STYLE>
<TABLE WIDTH="408" BORDER="0" CELLSPACING="0" CELLPADDING="1">
<TR>
<TD WIDTH="406" BGCOLOR="#333333"><TABLE WIDTH="406" BORDER="0" CELLSPACING="0" CELLPADDING="5">
<TR>
<TD BGCOLOR="#FFFFFF">
<DIV CLASS="article">ブラジルのインテルナシオナル、サンパウロ、フラメンゴと名門クラブを渡り歩き、95年に現役ブラジル代表の肩書きを引っさげ入団、セレッソ大阪を支えた現役ブラジル代表ゴールキーパー、ジルマールを特集!</DIV></TD>
</TR>
</TABLE></TD>
</TR>
</TABLE>
831 ：Name_Not_Found：04/02/18 09:28 ID:???
…。
832 ：Name_Not_Found：04/02/19 08:16 ID:???
猫も杓子もバグ
833 ：Name_Not_Found：04/02/19 20:46 ID:???
834 ：Name_Not_Found：04/02/19 20:49 ID:???
835 ：Name_Not_Found：04/02/20 07:51 ID:???
だからすぐにバグって言う癖やめろ
836 ：Name_Not_Found：04/02/20 08:04 ID:???
バグかと問うて居るのであって、バグだと断じたわけでない。
バグでないならないと教示してやるがいい。
バグでないならないと教示してやるがいい。
837 ：Name_Not_Found：04/02/20 08:40 ID:???
>>836
バグでない証明は仕様を見れば自明。
バグかと騒ぐならどう仕様と食い違っているのかを明らかにせよ。
自分のマークアップ及びスタイル記述に問題があると思うならCSS質問スレにいけってこと。
ここでバグかと問いかけるならそれに準ずる論拠を持ってこいと。
バグでない証明は仕様を見れば自明。
バグかと騒ぐならどう仕様と食い違っているのかを明らかにせよ。
自分のマークアップ及びスタイル記述に問題があると思うならCSS質問スレにいけってこと。
ここでバグかと問いかけるならそれに準ずる論拠を持ってこいと。
838 ：Name_Not_Found：04/02/20 08:46 ID:???
>>837
CSS質問スレにいけって、>>834は正に質問スレッドだが。
Netscape7.01とMac IE 5.1.6とで表示が異なるとのこと。
どちらかが「仕様と食い違っている」ことになるわな。よく知らんが。
CSS質問スレにいけって、>>834は正に質問スレッドだが。
Netscape7.01とMac IE 5.1.6とで表示が異なるとのこと。
どちらかが「仕様と食い違っている」ことになるわな。よく知らんが。
839 ：Name_Not_Found：04/02/20 08:50 ID:???
向こうのスレでもそんな結論になってないだろ
要点がつかめてない質問だから放置されてるだけ
要点がつかめてない質問だから放置されてるだけ
840 ：Name_Not_Found：04/02/20 08:54 ID:???
放置しないで返答なり批判なり指摘してやれば済む話なのにね。
841 ：Name_Not_Found：04/02/20 08:56 ID:???
842 ：Name_Not_Found：04/02/20 08:58 ID:???
>>837
同意。
同意。
843 ：Name_Not_Found：04/02/20 08:58 ID:???
だから、何をどうバグだと思うのか簡潔に書けよ
「この箇所がバグだと思うのですが」とかやめろ
「この箇所がバグだと思うのですが」とかやめろ
844 ：Name_Not_Found：04/02/20 09:12 ID:???
何を苛立ってるのかなあ。
所詮質問者はわからないから質問するので、それに多くを求めても無理よ。
知識があるなら出し惜しみせずに示してやればよいのだ。
所詮質問者はわからないから質問するので、それに多くを求めても無理よ。
知識があるなら出し惜しみせずに示してやればよいのだ。
845 ：Name_Not_Found：04/02/20 09:15 ID:???
質問者がこのスレに来るなよ
846 ：Name_Not_Found：04/02/20 09:28 ID:???
>>845 それは傲慢だな。バグに関する質問ならアリのはず。
実際、相手にされなかった>>830だって、追試すればバグが見つかったりするのだ。
【Netscape7.1/Win98SE】
.article {
background:yellow;
font-family:monospace;
font-weight: bold;
width:29em;
}
<DIV CLASS="article">ブラジルのインテルナシオナル、サンパウロ、フラメンゴと名門クラブを渡り歩き、95年に現役ブラジル代表の肩書きを引っさげ入団、セレッソ大阪を支えた現役ブラジル代表ゴールキーパー、ジルマールを特集!</DIV>
折返しにかかる「フラメンコ」の「ン」、「ブラジル」の「ラ」の字の右半分が欠ける。
boldを指定しなければこれは起らない。
実際、相手にされなかった>>830だって、追試すればバグが見つかったりするのだ。
【Netscape7.1/Win98SE】
.article {
background:yellow;
font-family:monospace;
font-weight: bold;
width:29em;
}
<DIV CLASS="article">ブラジルのインテルナシオナル、サンパウロ、フラメンゴと名門クラブを渡り歩き、95年に現役ブラジル代表の肩書きを引っさげ入団、セレッソ大阪を支えた現役ブラジル代表ゴールキーパー、ジルマールを特集!</DIV>
折返しにかかる「フラメンコ」の「ン」、「ブラジル」の「ラ」の字の右半分が欠ける。
boldを指定しなければこれは起らない。
847 ：Name_Not_Found：04/02/20 09:31 ID:???
バグか?
848 ：Name_Not_Found：04/02/20 09:33 ID:???
バグでないならないと教示してやるがいい。
849 ：Name_Not_Found：04/02/20 10:16 ID:???
ちょっとおもろいなこいつ
850 ：Name_Not_Found：04/02/20 10:29 ID:???
>>846は、カタカナでない「ブラジル代表の」の「の」の字は
折返しにかかってても字が欠けないんだよね。ヘンなの。
折返しにかかってても字が欠けないんだよね。ヘンなの。
851 ：Name_Not_Found：04/02/20 10:33 ID:???
>>846
再現性無し
再現性無し
852 ：Name_Not_Found：04/02/20 10:46 ID:???
>>851 ＯＳは？ またWin98/Meと2000/XPとで異なるってやつかもよ。
853 ：Name_Not_Found：04/02/20 10:50 ID:???
854 ：Name_Not_Found：04/02/20 10:56 ID:???
>>846はこれで再現する。
.parent {overflow:auto;}
.article {
font-si0ze: 14px;
font-family:monospace;
font-weight:600;
background:yellow;
width:29em;
}
<div class="parent">
<DIV CLASS="article">ブラジルのインテルナシオナル、サンパウロ、フラメンゴと名門クラブを渡り歩き、95年に現役ブラジル代表の肩書きを引っさげ入団、セレッソ大阪を支えた現役ブラジル代表ゴールキーパー、ジルマールを特集!</DIV>
</div>
overflow:auto;がoverflow:scroll;でもやはり字が欠けるのは一緒。
.parent {overflow:auto;}
.article {
font-si0ze: 14px;
font-family:monospace;
font-weight:600;
background:yellow;
width:29em;
}
<div class="parent">
<DIV CLASS="article">ブラジルのインテルナシオナル、サンパウロ、フラメンゴと名門クラブを渡り歩き、95年に現役ブラジル代表の肩書きを引っさげ入団、セレッソ大阪を支えた現役ブラジル代表ゴールキーパー、ジルマールを特集!</DIV>
</div>
overflow:auto;がoverflow:scroll;でもやはり字が欠けるのは一緒。
855 ：Name_Not_Found：04/02/20 10:58 ID:???
856 ：Name_Not_Found：04/02/20 11:01 ID:???
>>853 Netscape7.1のバグをIE6で再現しないとか文句つけられてもな……
857 ：Name_Not_Found：04/02/20 11:21 ID:???
Bugzilla-jp
[Win9x] 太字/ボールド/boldの幅計算が実際より小さくなっている - 太字の文字列を選択したときに右に揺れ動く - 太字の文字列が右端で綺麗に折り返さない - boldで、letter-spacingが0以外の要素のテキストがその次の内容と重なる - 等幅ボールド文字が欠ける
http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=395
[Win9x] 太字/ボールド/boldの幅計算が実際より小さくなっている - 太字の文字列を選択したときに右に揺れ動く - 太字の文字列が右端で綺麗に折り返さない - boldで、letter-spacingが0以外の要素のテキストがその次の内容と重なる - 等幅ボールド文字が欠ける
http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=395
858 ：Name_Not_Found：04/02/20 11:35 ID:???
おしまい
859 ：Name_Not_Found：04/02/20 19:37 ID:???
で、>>834はどうなった？ 仕様のどこに該当するのか。
860 ：Name_Not_Found：04/02/21 01:06 ID:???
>>854はこれに該当するか？
等幅フォントで表示した文字列の末尾が欠ける(N7.x)
http://cssbug.at.infoseek.co.jp/detail/mozilla/b065.html
しかし上記には、ボールドであることが条件と記してないし、
さらにoverflowプロパティ明示との関係にいたっては触れてない。
要追記？
等幅フォントで表示した文字列の末尾が欠ける(N7.x)
http://cssbug.at.infoseek.co.jp/detail/mozilla/b065.html
しかし上記には、ボールドであることが条件と記してないし、
さらにoverflowプロパティ明示との関係にいたっては触れてない。
要追記？
861 ：Name_Not_Found：04/02/21 09:08 ID:???
overflowは別問題。親要素でなくてもなるし。
862 ：Name_Not_Found：04/02/22 13:26 ID:???
バグかどうか分からないのですがNN7.1で外部スタイルシートで
指定した一番目の要素が無視されてしまいます。IE6では問題ないです。
body {
background:url(background.gif);
font-size:10pt;
}
↑の場合だと背景、文字サイズ共に無視され
body {font-size:10pt;}
body {
background:url(background04.gif);
font-size:10pt;
}
↑のように最初に適当なのを加えると、どちらも反映されます。
指定した一番目の要素が無視されてしまいます。IE6では問題ないです。
body {
background:url(background.gif);
font-size:10pt;
}
↑の場合だと背景、文字サイズ共に無視され
body {font-size:10pt;}
body {
background:url(background04.gif);
font-size:10pt;
}
↑のように最初に適当なのを加えると、どちらも反映されます。
863 ：Name_Not_Found：04/02/22 15:42 ID:???
それどっか別のところで ; 抜かしたりとかしてるだけじゃねーの？
文法チェッカかけてみれ
文法チェッカかけてみれ
864 ：Name_Not_Found：04/02/22 19:28 ID:???
865 ：Name_Not_Found：04/02/24 17:25 ID:???
未確認バグ MacIE
text-alignを指定した要素内で文字列とリンクが機能する位置とがずれる(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b051.html
5.2(OSX)と5.1(OS9)で確認しました。
あとこのバグの症状なんですが
>a要素の内容物がある位置とリンクとして機能する（例えばマウスポインタの形状が変化する）位置とがずれてしまうことがある。
ではなくて
>a要素の内容物がある位置とtext-alignプロパティを指定していないときに表示されるであろう位置の両方でリンクが反応する。
が正しい症状です。
あと当然ですが左寄せを指定した場合はなにも起きません。
text-alignを指定した要素内で文字列とリンクが機能する位置とがずれる(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b051.html
5.2(OSX)と5.1(OS9)で確認しました。
あとこのバグの症状なんですが
>a要素の内容物がある位置とリンクとして機能する（例えばマウスポインタの形状が変化する）位置とがずれてしまうことがある。
ではなくて
>a要素の内容物がある位置とtext-alignプロパティを指定していないときに表示されるであろう位置の両方でリンクが反応する。
が正しい症状です。
あと当然ですが左寄せを指定した場合はなにも起きません。
追記
親要素でtext-alignプロパティを指定した場合にも発生します。
ただし子要素の方でtext-align:leftを指定すると発生しなくなります。
親要素でtext-alignプロパティを指定した場合にも発生します。
ただし子要素の方でtext-align:leftを指定すると発生しなくなります。
867 ：Name_Not_Found：04/02/25 11:30 ID:???
mozilla 1.5あたりから最新のFirefoxまで、
foo, bar, zot {
some-decrarations
}
だとdecrarationsが無視されて
foo {
same-decrarations
}
bar {
same-decrarations
}
zot {
same-decrarations
}
だと通る、というのをついさっき発見したのですけど、これって既知ですか？
これはMozillaの中の人がわるいのですか？ それともおいらの書きかたが悪いですか？
Mozilla 1.4.1/IEだとどちらの書き方でもこちらの意図どおりに表示されています。
foo, bar, zot {
some-decrarations
}
だとdecrarationsが無視されて
foo {
same-decrarations
}
bar {
same-decrarations
}
zot {
same-decrarations
}
だと通る、というのをついさっき発見したのですけど、これって既知ですか？
これはMozillaの中の人がわるいのですか？ それともおいらの書きかたが悪いですか？
Mozilla 1.4.1/IEだとどちらの書き方でもこちらの意図どおりに表示されています。
868 ：Name_Not_Found：04/02/25 12:08 ID:???
869 ：Name_Not_Found：04/02/25 12:48 ID:???
>>868
すみません。いろいろ試してみたところ、
foo, bar, zotとコロンでつなげるのがまずいのではなくて、
foo, bar, zot. ... という要素の中に A:forcus が入っているとその宣言が無視されてしまう、という症状みたいです。
すみません。いろいろ試してみたところ、
foo, bar, zotとコロンでつなげるのがまずいのではなくて、
foo, bar, zot. ... という要素の中に A:forcus が入っているとその宣言が無視されてしまう、という症状みたいです。
870 ：Name_Not_Found：04/02/25 13:03 ID:???
>>869
症状が再現する最小限のソースを出せ
症状が再現する最小限のソースを出せ
871 ：Name_Not_Found：04/02/25 13:25 ID:???
872 ：Name_Not_Found：04/02/25 14:04 ID:???
873 ：Name_Not_Found：04/02/25 14:11 ID:???
あー。なるほど。
おいらの持っていたすみけんの本の90ページでA:forcusと書いてあったもんでそのまま打ち込んでました。
お騒がせしてしみません。
おいらの持っていたすみけんの本の90ページでA:forcusと書いてあったもんでそのまま打ち込んでました。
お騒がせしてしみません。
874 ：Name_Not_Found：04/02/25 16:17 ID:???
WinIEは :focus疑似クラスに対応してない
今試してみてわかったんだが、WinIEは
a:link、a:visited、a:hover、a:active じゃなくて
a:l、a:v、a:h、a:a と書いても効くのか……
今試してみてわかったんだが、WinIEは
a:link、a:visited、a:hover、a:active じゃなくて
a:l、a:v、a:h、a:a と書いても効くのか……
875 ：Name_Not_Found：04/02/25 16:38 ID:???
876 ：Name_Not_Found：04/02/25 16:53 ID:???
懐かしい話題やな
877 ：Name_Not_Found：04/02/25 19:05 ID:???
>>871 に関して。
未知を、まるで文法違反の如く、無視してしまう例。
abbr, acronym { border : none ; }
を IE が無視するのは、IE のバグである。
何故なら、
- CSS は、マークアップに依存しない。
- それにも関わらず、HTML に限って、未知の要素型にマッチするセレクタが
グルーピングに含まれていると、そのルールを丸ごと無視してしまう、
から。
本来これは、検証時において、エラーにならず、グルーピングを分割して、
abbr { border : none ; }
acronym { border : none ; }
という形で各セレクタがマッチする個々の要素を調べるよう実装された上で、
知っていようがいまいが、<abbr ..> .. </abbr> を見付けたら、ルールを
適用しようと試みなければならない。
次に、検証時の完全なエラーがある。仕様書の例にもある通り、
h3, h4 & h5 { color : red ; }
では、セレクタに & という文法範囲外の文字が使われている。
こういう検証時の完全なエラーは、そのルールを全て無視しなければならない。
仕様書の表現も拝借すれば、各 h3 要素の color は変わらない。
(続く)
未知を、まるで文法違反の如く、無視してしまう例。
abbr, acronym { border : none ; }
を IE が無視するのは、IE のバグである。
何故なら、
- CSS は、マークアップに依存しない。
- それにも関わらず、HTML に限って、未知の要素型にマッチするセレクタが
グルーピングに含まれていると、そのルールを丸ごと無視してしまう、
から。
本来これは、検証時において、エラーにならず、グルーピングを分割して、
abbr { border : none ; }
acronym { border : none ; }
という形で各セレクタがマッチする個々の要素を調べるよう実装された上で、
知っていようがいまいが、<abbr ..> .. </abbr> を見付けたら、ルールを
適用しようと試みなければならない。
次に、検証時の完全なエラーがある。仕様書の例にもある通り、
h3, h4 & h5 { color : red ; }
では、セレクタに & という文法範囲外の文字が使われている。
こういう検証時の完全なエラーは、そのルールを全て無視しなければならない。
仕様書の表現も拝借すれば、各 h3 要素の color は変わらない。
(続く)
878 ：Name_Not_Found：04/02/25 19:10 ID:???
( >>877 の続き)
(以下は、>>869 の報告を鵜呑みにして書いてある部分があるので注意。)
では、未知の擬似クラスを含むグルーピングを、文法違反の如く、
無視してしまうのはどうなのか。結論から言えば、その実装はおかしい。
綴り間違いの :forcus は、未知であっても決して検証時のエラーにはならない。
現在までの勧告から草案全てにおいて、その :forcus が登場しないから、
意図的にエラーにしているのではないか、と勘繰る事も出来る。
が、それこそまさに蛇足、おかしな実装だ。将来その :forcus
が出て来ない保証は無い (現実には出て来ないだろうが)。
何にせよ、文法違反に該当しないのに、グルーピングごと無視するのは、
間違っている。過去のモジラの実装が正しい。さもなくば、
グルーピングの存在そのものが否定されてしまう。
( IE の場合、未知の擬似クラスを unknown と書き換えるから、
それはそれで大いにおかしい。)
例えば、
p, q, a:forcus { text-decoration : overline ; }
は、
p { text-decoration : overline ; }
q { text-decoration : overline ; }
として解釈されるべきだ。
(以下は、>>869 の報告を鵜呑みにして書いてある部分があるので注意。)
では、未知の擬似クラスを含むグルーピングを、文法違反の如く、
無視してしまうのはどうなのか。結論から言えば、その実装はおかしい。
綴り間違いの :forcus は、未知であっても決して検証時のエラーにはならない。
現在までの勧告から草案全てにおいて、その :forcus が登場しないから、
意図的にエラーにしているのではないか、と勘繰る事も出来る。
が、それこそまさに蛇足、おかしな実装だ。将来その :forcus
が出て来ない保証は無い (現実には出て来ないだろうが)。
何にせよ、文法違反に該当しないのに、グルーピングごと無視するのは、
間違っている。過去のモジラの実装が正しい。さもなくば、
グルーピングの存在そのものが否定されてしまう。
( IE の場合、未知の擬似クラスを unknown と書き換えるから、
それはそれで大いにおかしい。)
例えば、
p, q, a:forcus { text-decoration : overline ; }
は、
p { text-decoration : overline ; }
q { text-decoration : overline ; }
として解釈されるべきだ。
勢いで書いてしまいましたが、完全にスレ違いですね。
一応、誤解の無いようにしておくと、
>>871 は正しいわけです。
しかし、それでは、ユーザー ( CSS 作者 ) が、常に CSS のレベルを意識して
グルーピングしなければならず、本来、「簡単で楽しい」CSS が、
マニアックになってしまい、好ましくないと思う、と。
即ち、過去のモジラが正しくなるように仕様書を書き換えろ、であり、
現実は、現在のモジラがより正しい ( CSSはマニアックだ )
ということになります。
ともかく、スレ違い、失礼しました。
一応、誤解の無いようにしておくと、
>>871 は正しいわけです。
しかし、それでは、ユーザー ( CSS 作者 ) が、常に CSS のレベルを意識して
グルーピングしなければならず、本来、「簡単で楽しい」CSS が、
マニアックになってしまい、好ましくないと思う、と。
即ち、過去のモジラが正しくなるように仕様書を書き換えろ、であり、
現実は、現在のモジラがより正しい ( CSSはマニアックだ )
ということになります。
ともかく、スレ違い、失礼しました。
880 ：Name_Not_Found：04/02/25 19:58 ID:???
>>877-878
勘違いも甚だだしい。abbr のバグは CSS の問題ではない。
IE は abbr と /abbr なる空要素としてツリー構造を組み立てる。
つまり，HTML の解析の段階で不正なので，CSS の問題ではないと。
参考：http://www.akatsukinishisu.net/itazuragaki/id/WinIE_abbr
>p, q, a:forcus { text-decoration : overline ; }
>は、
>p { text-decoration : overline ; }
>q { text-decoration : overline ; }
>として解釈されるべきだ。
仕様書に精通していない人が憶測で嘘を書かないで欲しい。
CSS2仕様書 4.1.7 において，
「ユーザエージェントがセレクタを解析できない場合（つまりCSS2の仕様に照らしてセレクタが不正である場合）、付随する宣言ブロックごと無視しなければならない。」
「セレクタに1箇所でもエラーがあれば、セレクタの残りの部分がCSS2として正当でも、文全体を無視すべきである。」と書かれている。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/syndata.html#q8
因みにこのエラー処理は，CSS2を含む全版のCSSについて一貫して共通している。
勘違いも甚だだしい。abbr のバグは CSS の問題ではない。
IE は abbr と /abbr なる空要素としてツリー構造を組み立てる。
つまり，HTML の解析の段階で不正なので，CSS の問題ではないと。
参考：http://www.akatsukinishisu.net/itazuragaki/id/WinIE_abbr
>p, q, a:forcus { text-decoration : overline ; }
>は、
>p { text-decoration : overline ; }
>q { text-decoration : overline ; }
>として解釈されるべきだ。
仕様書に精通していない人が憶測で嘘を書かないで欲しい。
CSS2仕様書 4.1.7 において，
「ユーザエージェントがセレクタを解析できない場合（つまりCSS2の仕様に照らしてセレクタが不正である場合）、付随する宣言ブロックごと無視しなければならない。」
「セレクタに1箇所でもエラーがあれば、セレクタの残りの部分がCSS2として正当でも、文全体を無視すべきである。」と書かれている。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/syndata.html#q8
因みにこのエラー処理は，CSS2を含む全版のCSSについて一貫して共通している。
881 ：Name_Not_Found：04/02/25 20:53 ID:???
で、>>867-869もバグではなかったってことでいいんだよね？
882 ：Name_Not_Found：04/02/26 10:37 ID:???
883 ：Name_Not_Found：04/02/26 10:42 ID:???
ブロックボックス化した要素を含むリストアイテムの後ろに空行が入る(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
バグ回避法に追加、いいですか。
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
上の例示ソースを下記の通り改行無しにすると、バグは起きなくなった。
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li><li><a href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
バグ回避法に追加、いいですか。
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
上の例示ソースを下記の通り改行無しにすると、バグは起きなくなった。
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li><li><a href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
追記。
これだと、ソースで改行してあってもバグは起きない。
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li><li>
<a href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li><li><a
href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
要するに、</li>で改行しなければよいのらしい。
この方が実際向きかな。
これだと、ソースで改行してあってもバグは起きない。
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li><li>
<a href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
<ul>
<li><a href="../winie.html" style="display:block;">WinIE目次</a></li><li><a
href="../winie.html" style="display:block;">WinIE目次</a></li>
</ul>
要するに、</li>で改行しなければよいのらしい。
この方が実際向きかな。
885 ：Name_Not_Found：04/02/26 12:46 ID:???
>>883-884
<ul>
<li><a href="hoge">hoge</a></li><!--
--><li><a href="hoge">hoge</a></li>
</ul>
こうやって改行をコメントアウトしても発生しないよ。
恐ろしくめんどくさいんで実用的じゃないけど。
<ul>
<li><a href="hoge">hoge</a></li><!--
--><li><a href="hoge">hoge</a></li>
</ul>
こうやって改行をコメントアウトしても発生しないよ。
恐ろしくめんどくさいんで実用的じゃないけど。
886 ：Name_Not_Found：04/02/26 12:50 ID:???
li a {display:block;}
<li><a href="hoge">hoge</a></li><!-- -->
<li><a href="hoge">hoge</a></li>
では駄目なんだよね。何だかな。
<li><a href="hoge">hoge</a></li><!-- -->
<li><a href="hoge">hoge</a></li>
では駄目なんだよね。何だかな。
887 ：Name_Not_Found：04/02/26 13:34 ID:???
innerHTML で Mozilla と WinIE の
内部ソースを較べると IE の糞さが解かる。
要素間の空白ノードを勝手に取り除くし、
終了タグが正常に補完されなかったりする。
WinIE では絶対にツリー構造が制作者の意図通りにならない。
DOM のノードがおかしいから、CSS の適用にも影響してしまう。
内部ソースを較べると IE の糞さが解かる。
要素間の空白ノードを勝手に取り除くし、
終了タグが正常に補完されなかったりする。
WinIE では絶対にツリー構造が制作者の意図通りにならない。
DOM のノードがおかしいから、CSS の適用にも影響してしまう。
888 ：Name_Not_Found：04/02/26 14:40 ID:???
>>887 具体的に個々のバグを挙げて報告してくれると有り難い。
889 ：Name_Not_Found：04/02/26 15:17 ID:???
WinIE6で以下の二つを見比べると下のほうが
rtの文字列が右寄りになるのは既出ですか？
=====================================================
<ruby><rb>テストテスト</rb><rt>てすとてすと</rt></ruby>
<br><!-- ただの見やすさのための改行 -->
<ruby><rb>テストテスト</rb>
<rt>てすとてすと</rt></ruby>
=====================================================
rtの文字列が右寄りになるのは既出ですか？
=====================================================
<ruby><rb>テストテスト</rb><rt>てすとてすと</rt></ruby>
<br><!-- ただの見やすさのための改行 -->
<ruby><rb>テストテスト</rb>
<rt>てすとてすと</rt></ruby>
=====================================================
890 ：Name_Not_Found：04/02/26 15:22 ID:???
891 ：Name_Not_Found：04/02/26 16:10 ID:???
つまりブラウザのデフォルトスタイルシートですな。
MozやOpeではデフォルトで表現してくれないので無関係です。
MozやOpeではデフォルトで表現してくれないので無関係です。
892 ：Name_Not_Found：04/02/26 16:15 ID:???
無関係か？
ルビのスタイル
http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_20020316
Operaにおけるルビ要素へのスタイル付け
http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_in_opera_20031226
ルビのスタイル
http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_20020316
Operaにおけるルビ要素へのスタイル付け
http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_in_opera_20031226
893 ：Name_Not_Found：04/02/26 16:18 ID:???
少なくとも最初に
>> WinIE6で
と言っている時点で他のブラウザのことは無関係（少なくとも別件）ですな。
WinIEのrubyに対するデフォルトスタイルシートの話ですから。
>> WinIE6で
と言っている時点で他のブラウザのことは無関係（少なくとも別件）ですな。
WinIEのrubyに対するデフォルトスタイルシートの話ですから。
894 ：Name_Not_Found：04/02/26 16:21 ID:???
ここってデフォルト・スタイルシートまで問題にするスレッドだっけ？
で、同スタイルを他のブラウザで表示の比較をしてみたのかってことなんだが。
で、同スタイルを他のブラウザで表示の比較をしてみたのかってことなんだが。
895 ：Name_Not_Found：04/02/26 16:27 ID:???
誰も同じスタイルを他のブラウザで表現できるかどうかなんて話はしてませんが。
とはいえその一行目は正しそうですね。
>889の件は撤回させていただきます。
とはいえその一行目は正しそうですね。
>889の件は撤回させていただきます。
896 ：Name_Not_Found：04/02/26 16:43 ID:???
ruby {background:red;}
rb {background:blue;}/*効かない*/
rt {background:yellow;}/*Mozillaは効かない*/
改行が多いほど、ruby要素全体の幅が長くなってるのがわかるかね？
但し、二番目と三番目のrt要素の幅は同じ。
<ruby><rb>テスト００１</rb><rt>てすと</rt></ruby>
<br><!-- ただの見やすさのための改行 -->
<ruby><rb>テスト００２</rb>
<rt>てすと</rt></ruby>
<br>
<ruby>
<rb>テスト００３</rb>
<rt>てすと</rt>
</ruby>
Netscape7.1では、ルビ表示のスタイルにしても、そんなことはない。どれも同じ幅。
rb {background:blue;}/*効かない*/
rt {background:yellow;}/*Mozillaは効かない*/
改行が多いほど、ruby要素全体の幅が長くなってるのがわかるかね？
但し、二番目と三番目のrt要素の幅は同じ。
<ruby><rb>テスト００１</rb><rt>てすと</rt></ruby>
<br><!-- ただの見やすさのための改行 -->
<ruby><rb>テスト００２</rb>
<rt>てすと</rt></ruby>
<br>
<ruby>
<rb>テスト００３</rb>
<rt>てすと</rt>
</ruby>
Netscape7.1では、ルビ表示のスタイルにしても、そんなことはない。どれも同じ幅。
897 ：Name_Not_Found：04/02/26 16:45 ID:???
デフォルトスタイルシートはスレ違いでしょ。
898 ：Name_Not_Found：04/02/26 17:01 ID:???
ならNetscape7.1のバグだ。
ruby>rb {display:table-row-group;}
と指定してあると、rb要素へのborderやbackground指定が効かなくなる。
ruby>rt, ruby>rbc+rtc {display:table-header-group;}
と指定してあると、rt要素へのborderやbackground指定が効かなくなる。
あとIE6.0は、なぜかrb要素へのborderやbackground指定が効かない。
ruby>rb {display:table-row-group;}
と指定してあると、rb要素へのborderやbackground指定が効かなくなる。
ruby>rt, ruby>rbc+rtc {display:table-header-group;}
と指定してあると、rt要素へのborderやbackground指定が効かなくなる。
あとIE6.0は、なぜかrb要素へのborderやbackground指定が効かない。
899 ：Name_Not_Found：04/02/26 17:53 ID:???
>>898
実は MSIE の仕様ではrb要素が存在しなかったりして、
rb と /rb なる空要素としてオブジェクトツリーを生成する。
これはabbr要素と同現象。
ttp://www.akatsukinishisu.net/itazuragaki/id/WinIE_abbr
実は MSIE の仕様ではrb要素が存在しなかったりして、
rb と /rb なる空要素としてオブジェクトツリーを生成する。
これはabbr要素と同現象。
ttp://www.akatsukinishisu.net/itazuragaki/id/WinIE_abbr
900 ：Name_Not_Found：04/02/26 17:56 ID:???
どうやら MSIE は未知の要素すべてを空要素として解釈するらしい。
901 ：Name_Not_Found：04/02/26 18:15 ID:???
document.getElementsByTagName('/rb');
とすると /rb という謎要素を見事にゲットできる。
document.getElementsByTagName('!')[0].text;
とかするとDOCTYPE宣言をゲットできるというのも有名。
とすると /rb という謎要素を見事にゲットできる。
document.getElementsByTagName('!')[0].text;
とかするとDOCTYPE宣言をゲットできるというのも有名。
902 ：Name_Not_Found：04/02/27 00:33 ID:???
http://pc2.2ch.net/test/read.cgi/hp/1076968824/261n
261 ：Name_Not_Found ：04/02/26 23:12 ID:???
Win/ie6
<h1>h1-1</h1>
<h2>h2-1</h2>
<ul><li>normal</li></ul>
<h2>h2-2</h2>
<ul><li>おかしくなる</li></ul>
<h2>h2-3</h2>
<ul><li>おかしくなる</li></ul>
上に
h2:first-letter { color: #rgb; }
と擬似クラスを使うとリストがおかしくなるのですが
ここらへんのバグについて、バグる条件や回避策なんかあったら教えてください。
261 ：Name_Not_Found ：04/02/26 23:12 ID:???
Win/ie6
<h1>h1-1</h1>
<h2>h2-1</h2>
<ul><li>normal</li></ul>
<h2>h2-2</h2>
<ul><li>おかしくなる</li></ul>
<h2>h2-3</h2>
<ul><li>おかしくなる</li></ul>
上に
h2:first-letter { color: #rgb; }
と擬似クラスを使うとリストがおかしくなるのですが
ここらへんのバグについて、バグる条件や回避策なんかあったら教えてください。
903 ：Name_Not_Found：04/02/27 02:56 ID:???
【IE6】
ブロック要素の子要素にclear:right; float:right;を指定してあると空行ができる。
p {
margin:0;padding:0;
clear:right;
float:right;
width:5em; border:solid 1px;
}
<p>1</p>
<p>2</p>
<div><p>3</p></div>
<p style="clear:all;">clear</p>
2と3の間に空行ができる。
IE6だけ。NN7とOpera7.2では間が空かず、123は縦に連続する。
divの四辺いづれかにでもborderを設定したら、空行は消えた。
ブロック要素の子要素にclear:right; float:right;を指定してあると空行ができる。
p {
margin:0;padding:0;
clear:right;
float:right;
width:5em; border:solid 1px;
}
<p>1</p>
<p>2</p>
<div><p>3</p></div>
<p style="clear:all;">clear</p>
2と3の間に空行ができる。
IE6だけ。NN7とOpera7.2では間が空かず、123は縦に連続する。
divの四辺いづれかにでもborderを設定したら、空行は消えた。
904 ：Name_Not_Found：04/02/27 03:11 ID:???
>>903のバグは、親ブロック要素がliの場合、IEでも起らない。
p {margin:0;padding:0; clear:right; float:right; width:5em; border:solid 1px;}
<ul>
<li>
<p>１</p>
<p>２</p>
</li>
<li>
<p>３</p>
</li>
</ul>
しかしこれは、なぜかMozillaだけ
１
３２
と列べた表示になる。IE・Operaのバグなのか？
http://pc2.2ch.net/test/read.cgi/hp/1076968824/220n
http://pc2.2ch.net/test/read.cgi/hp/1076968824/272n
p {margin:0;padding:0; clear:right; float:right; width:5em; border:solid 1px;}
<ul>
<li>
<p>１</p>
<p>２</p>
</li>
<li>
<p>３</p>
</li>
</ul>
しかしこれは、なぜかMozillaだけ
１
３２
と列べた表示になる。IE・Operaのバグなのか？
http://pc2.2ch.net/test/read.cgi/hp/1076968824/220n
http://pc2.2ch.net/test/read.cgi/hp/1076968824/272n
905 ：Name_Not_Found：04/02/27 22:48 ID:???
>>902
:first-letterをかける要素はh2でなくてもブロック要素ならh3でもpでも何でもいいみたいね。
そのブロック要素にwidth:100%;とか何か幅を明示してやると、バグは起きなくなった。
:first-letterをかける要素はh2でなくてもブロック要素ならh3でもpでも何でもいいみたいね。
そのブロック要素にwidth:100%;とか何か幅を明示してやると、バグは起きなくなった。
906 ：Name_Not_Found：04/02/27 22:51 ID:???
未確認バグ MacIE
:hover擬似クラスでvertical-alignが無効(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b052.html
MacIE5.1(OS9.2)で確認しました。
:hover擬似クラスでvertical-alignが無効(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b052.html
MacIE5.1(OS9.2)で確認しました。
907 ：Name_Not_Found：04/02/27 23:42 ID:???
>>887
IEの実装を糞と呼ぶのは結構だが
innerHTMLなんて仕様の標準化されてないもの比較しても意味はない。
それから、DOM2Coreは
構築されるDOMにパーザ依存の差異が生じる可能性を別に否定はしていない。
IEの実装を糞と呼ぶのは結構だが
innerHTMLなんて仕様の標準化されてないもの比較しても意味はない。
それから、DOM2Coreは
構築されるDOMにパーザ依存の差異が生じる可能性を別に否定はしていない。
908 ：Name_Not_Found：04/02/27 23:53 ID:???
MacIEバグ
インラインボックス化したli要素に背景色を設定すると内容物が消える(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b035.html
症状が正しくないので修正をお願いします。
正しくは以下の通りです。
li要素の背景がtext-alignを指定しなかった場合の位置まで延び、手前にあるli要素を覆い隠してしまう。（結果的に最後のリンクだけ見える。）
その際、隠れた要素は見えないだけでリンクは機能している。（バグ051と組合わさって無数の見えないリンクが発生してしまう。）
ul要素のli要素だけでなくol要素のli要素、dl要素のdt,dd要素全てで発生する。
背景に画像を指定した場合も発生する。
インラインボックス化したli要素に背景色を設定すると内容物が消える(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b035.html
症状が正しくないので修正をお願いします。
正しくは以下の通りです。
li要素の背景がtext-alignを指定しなかった場合の位置まで延び、手前にあるli要素を覆い隠してしまう。（結果的に最後のリンクだけ見える。）
その際、隠れた要素は見えないだけでリンクは機能している。（バグ051と組合わさって無数の見えないリンクが発生してしまう。）
ul要素のli要素だけでなくol要素のli要素、dl要素のdt,dd要素全てで発生する。
背景に画像を指定した場合も発生する。
更新、お疲れさまです。
実体参照で表記した文字が正しく表示されない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
バグ033に統合されて内容が全部削除されてしまったみたいですが、
>>570で出た問題はバグ033とは異なる固有の問題として残るはずではありませんか。
実体参照で表記した文字が正しく表示されない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
バグ033に統合されて内容が全部削除されてしまったみたいですが、
>>570で出た問題はバグ033とは異なる固有の問題として残るはずではありませんか。
910 ：Name_Not_Found：04/02/28 00:24 ID:???
>>903
'clear'
値: none | left | right | both | inherit
初期値: none
適用対象: ブロックレベル要素
継承: しない
パーセント値: N/A
メディア: 視覚メディア
まぁ一応allという値はないぞと。
'clear'
値: none | left | right | both | inherit
初期値: none
適用対象: ブロックレベル要素
継承: しない
パーセント値: N/A
メディア: 視覚メディア
まぁ一応allという値はないぞと。
911 ：Name_Not_Found：04/02/28 00:39 ID:???
bottom:0;に配置したボックスの下部が閲覧領域の外にはみ出す(7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b077.html
「再現できないので」とのことですが、
>>770にあった条件「文字列が２行以上に折り返される場合」をお忘れなく。
<div style="position:fixed; right:0; bottom:0;">固定配置</div>
上記の例示ソースを下記に変更すると、>>770＝>>813が再現しました。
<div style="position:fixed; bottom:0; left:0; width:6em; background:aqua;">折り返される長い文字列</div>
Opera7.23/Windows98SE にて確認しました。
http://cssbug.at.infoseek.co.jp/detail/opera/b077.html
「再現できないので」とのことですが、
>>770にあった条件「文字列が２行以上に折り返される場合」をお忘れなく。
<div style="position:fixed; right:0; bottom:0;">固定配置</div>
上記の例示ソースを下記に変更すると、>>770＝>>813が再現しました。
<div style="position:fixed; bottom:0; left:0; width:6em; background:aqua;">折り返される長い文字列</div>
Opera7.23/Windows98SE にて確認しました。
912 ：Name_Not_Found：04/02/28 00:50 ID:???
>>904
http://pc2.2ch.net/test/read.cgi/hp/1076968824/293
293 ：291 ：04/02/27 13:21 ID:???
とりあえず私見だが、>>220の件はC部分にもclear:rightが指定されてるから、
「それより以前に存在する全ての浮動ボックス下外辺より下に存在しなければならない」
のであるから、IE、Operaの挙動が正しいと思うんだが。
試しに<ul><li></li></ul>を<div></div>に置き換えてみたら、
IEMozOperaともに同じ表示のされ方をした。
http://pc2.2ch.net/test/read.cgi/hp/1076968824/293
293 ：291 ：04/02/27 13:21 ID:???
とりあえず私見だが、>>220の件はC部分にもclear:rightが指定されてるから、
「それより以前に存在する全ての浮動ボックス下外辺より下に存在しなければならない」
のであるから、IE、Operaの挙動が正しいと思うんだが。
試しに<ul><li></li></ul>を<div></div>に置き換えてみたら、
IEMozOperaともに同じ表示のされ方をした。
913 ：Name_Not_Found：04/02/28 01:13 ID:???
未確認バグ（>>819）
:hover状態になると親要素のボックス幅が広がる(5.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b145.html
これが起ったのは、リンク・アンカーが連続して列べてある場合でした。
↓ここの例示みたいな。
http://cssbug.at.infoseek.co.jp/detail/macie/b029.html
但し他にもHTML側の再現条件があるのかもしれません。
:hover状態になると親要素のボックス幅が広がる(5.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b145.html
これが起ったのは、リンク・アンカーが連続して列べてある場合でした。
↓ここの例示みたいな。
http://cssbug.at.infoseek.co.jp/detail/macie/b029.html
但し他にもHTML側の再現条件があるのかもしれません。
914 ：Name_Not_Found：04/02/28 11:30 ID:???
>>910 まぁそこはbugと関係ないし。
ところで>>903のbugだが、問題の親divにwidth:100%;と指定したら、
liで括った>>904のMozillaと似た並び方にされた。borderを指定しても解消しない。
p {margin:0;padding:0; clear:right; float:right; width:5em; border:solid 1px; }
<div>
<p>１</p>
<p>２</p></div>
<div style="border:1px solid yellow; width:100%;">
<p>３</p>
</div>
表示結果は
３ １
２
となる。widthの幅を変更しても、３が左にゆくだけ。
ところで>>903のbugだが、問題の親divにwidth:100%;と指定したら、
liで括った>>904のMozillaと似た並び方にされた。borderを指定しても解消しない。
p {margin:0;padding:0; clear:right; float:right; width:5em; border:solid 1px; }
<div>
<p>１</p>
<p>２</p></div>
<div style="border:1px solid yellow; width:100%;">
<p>３</p>
</div>
表示結果は
３ １
２
となる。widthの幅を変更しても、３が左にゆくだけ。
915 ：Name_Not_Found：04/02/28 11:39 ID:???
>>910
IEではall=both。
しかし、これは皆間違えるだろうからと余計なお世話でやった事なのか、
それともIE3のbetaテストでallが効かねーじゃねーかボケ！
というクレームがついたからやった事なのだろうか？
後者なら同情するが前者なら本当に余計なお世話だ。
IEではall=both。
しかし、これは皆間違えるだろうからと余計なお世話でやった事なのか、
それともIE3のbetaテストでallが効かねーじゃねーかボケ！
というクレームがついたからやった事なのだろうか？
後者なら同情するが前者なら本当に余計なお世話だ。
916 ：Name_Not_Found：04/02/28 11:41 ID:???
ってことは……と思って、>>904のliにもwidth:100%;を指定してみた。
すると、Mozillaのbug表示は防げる。
li p {margin:0;padding:0; clear:right; float:right; width:5em; border:solid 1px; }
<ul>
<li>
<p>D</p>
</li>
<li style="width:100%;">
<p>E</p>
<p>F</p>
</li>
</ul>
但し、100%以外だと駄目。
当り前か、幅100%ではfloatで横並びにできず、折返しされるやね。
すると、Mozillaのbug表示は防げる。
li p {margin:0;padding:0; clear:right; float:right; width:5em; border:solid 1px; }
<ul>
<li>
<p>D</p>
</li>
<li style="width:100%;">
<p>E</p>
<p>F</p>
</li>
</ul>
但し、100%以外だと駄目。
当り前か、幅100%ではfloatで横並びにできず、折返しされるやね。
917 ：Name_Not_Found：04/02/28 11:47 ID:???
918 ：Name_Not_Found：04/02/29 12:47 ID:???
http://cssbug.at.infoseek.co.jp/detail/winie/b097.html
サイズの大きいフロートの上に空白領域が発生する(5.0)
>または幅や高さが指定されたフロート化していない要素を子孫に持つ要素
てのが、よくわからないんですが。
「幅や高さが指定され且つフロート化していない要素」に対する親要素、のこと？
フロート化していない要素を子孫に持つ幅や高さを指定された親要素、のこと？
どちらにも取れます。
でも「CSS/DHTMLバグ辞典スレッド ver2.0」の948には
>b097には「幅や高さを指定した要素の下に」とあるが、「要素の中」でもなるらしい。
と報告されてました。
この報告に基づく記述だとすると、どちらも一致しなくありません？
しかも948は「幅や高さを指定しなくてもなる場合もあるとのこと」と例を出してますし。
サイズの大きいフロートの上に空白領域が発生する(5.0)
>または幅や高さが指定されたフロート化していない要素を子孫に持つ要素
てのが、よくわからないんですが。
「幅や高さが指定され且つフロート化していない要素」に対する親要素、のこと？
フロート化していない要素を子孫に持つ幅や高さを指定された親要素、のこと？
どちらにも取れます。
でも「CSS/DHTMLバグ辞典スレッド ver2.0」の948には
>b097には「幅や高さを指定した要素の下に」とあるが、「要素の中」でもなるらしい。
と報告されてました。
この報告に基づく記述だとすると、どちらも一致しなくありません？
しかも948は「幅や高さを指定しなくてもなる場合もあるとのこと」と例を出してますし。
919 ：Name_Not_Found：04/02/29 23:01 ID:???
以下のバグをMacIE5.2にて確認。
overflow:auto; を指定した要素の下に空白ができる(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b050.html
特定のテーブルに指定したボーダー色が別のテーブルにも適用される(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b049.html
フロート化したh1要素に続くdiv要素が回り込んで表示される(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b041.html
フロートでtext-align:center;指定が効かない(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b039.html
vertical-alignプロパティとinheritを指定したプロパティの組み合わせでクラッシュ(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b037.html
hr要素でwidthプロパティの指定値が正しく反映されない(IE5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b011.html
ブロック要素化したbr要素をテーブル内で使用するとセル幅が異常になる(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b006.html
clearプロパティが子孫要素に継承する(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b015.html
ルビつき文字がページ右端にあるとルビが正しい位置に表示されない(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b027.html
背景画像がボーダー辺を基準に配置される(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b031.html
overflow:auto; を指定した要素の下に空白ができる(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b050.html
特定のテーブルに指定したボーダー色が別のテーブルにも適用される(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b049.html
フロート化したh1要素に続くdiv要素が回り込んで表示される(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b041.html
フロートでtext-align:center;指定が効かない(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b039.html
vertical-alignプロパティとinheritを指定したプロパティの組み合わせでクラッシュ(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b037.html
hr要素でwidthプロパティの指定値が正しく反映されない(IE5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b011.html
ブロック要素化したbr要素をテーブル内で使用するとセル幅が異常になる(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b006.html
clearプロパティが子孫要素に継承する(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b015.html
ルビつき文字がページ右端にあるとルビが正しい位置に表示されない(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b027.html
背景画像がボーダー辺を基準に配置される(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b031.html
920 ：Name_Not_Found：04/02/29 23:53 ID:???
>>919 それ以外は修正されたってことですか？
921 ：Name_Not_Found：04/02/29 23:57 ID:???
もしくは確認していないってことですか？
923 ：Name_Not_Found：04/03/01 02:04 ID:???
MacIE 確認済みバグ
特定の文字数のルビが正しい位置に表示されない(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b026.html
5.2(OS10.3)で確認したところ14pxの時には発生しましたが15,16pxの時には発生しませんでした。
特定の文字数のルビが正しい位置に表示されない(IE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b026.html
5.2(OS10.3)で確認したところ14pxの時には発生しましたが15,16pxの時には発生しませんでした。
924 ：Name_Not_Found：04/03/01 02:35 ID:???
とにかくMacの人が確認してくれるのは有り難いよ。
ついでにSafariも気になるところ。→ http://www.danvine.com/icapture/
ついでにSafariも気になるところ。→ http://www.danvine.com/icapture/
925 ：Name_Not_Found：04/03/01 23:05 ID:???
MacIE 確認済みバグ
フロート要素内でポジショニングを行うと指定どおりに配置されない(4.x/5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b008.html
5.1.4(OS9.2)、5.2.3(OS10.3)では確認できませんでした。
フロート要素内でポジショニングを行うと指定どおりに配置されない(4.x/5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b008.html
5.1.4(OS9.2)、5.2.3(OS10.3)では確認できませんでした。
926 ：Name_Not_Found：04/03/01 23:56 ID:???
MacIE 未確認バグ
マージン領域に自身の背景が表示される(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b053.html
例示に
>相対配置したdiv要素（背景が黄色）は祖先のdiv要素（背景が黄緑色）の内容領域からはみ出させています。
とありますが、バグ023”相対配置要素の位置指定に負の値を使用できない(IE5)”のせいではみ出していません。
というかこれバグなんでしょうか。
報告書き込みを見る限り、バグ023に気づいていないだけのような気がするのですが。
マージン領域に自身の背景が表示される(5.1)
http://cssbug.at.infoseek.co.jp/detail/macie/b053.html
例示に
>相対配置したdiv要素（背景が黄色）は祖先のdiv要素（背景が黄緑色）の内容領域からはみ出させています。
とありますが、バグ023”相対配置要素の位置指定に負の値を使用できない(IE5)”のせいではみ出していません。
というかこれバグなんでしょうか。
報告書き込みを見る限り、バグ023に気づいていないだけのような気がするのですが。
927 ：Name_Not_Found：04/03/02 00:51 ID:???
>>917
HTML の br 要素型では clear = none | left | right | all だったからね。
HTML の br 要素型では clear = none | left | right | all だったからね。
929 ：Name_Not_Found：04/03/02 15:27 ID:???
clearプロパティが子孫要素に継承する(MacIE5)
http://cssbug.at.infoseek.co.jp/detail/macie/b015.html
確認してみましたが、これは継承の問題じゃないです。
<div style="clear: left">
<div style="float: left; width: 20%; clear: none">A</div>
<div style="clear: none">B</div>
</div>
このように中の要素すべてに「clear: none」を付けてみても
やはり「B」には「clear: left」が効いています。でも、
<div style="clear: left">
<div>
<div style="float: left; width: 20%">A</div>
</div>
<div>B</div>
</div>
このように、フロートしている「A」の部分を<div>で括ると
「B」はきちんと「A」の横に回り込みます。
つまりこれは、clearが子孫に継承するというバグではなく、
「clearが設定されている要素の子要素に、対応する方向の
floatを設定しても効かない」というバグだと思います。
継承はしないので孫要素なら問題なしです。
# 某はてなダイアリーはclearを設定した div.body 直下に
# floatを設定した img.photo があるので、スタイルをどう
# いじってもMacIEではフロート出来ないんだな。
http://cssbug.at.infoseek.co.jp/detail/macie/b015.html
確認してみましたが、これは継承の問題じゃないです。
<div style="clear: left">
<div style="float: left; width: 20%; clear: none">A</div>
<div style="clear: none">B</div>
</div>
このように中の要素すべてに「clear: none」を付けてみても
やはり「B」には「clear: left」が効いています。でも、
<div style="clear: left">
<div>
<div style="float: left; width: 20%">A</div>
</div>
<div>B</div>
</div>
このように、フロートしている「A」の部分を<div>で括ると
「B」はきちんと「A」の横に回り込みます。
つまりこれは、clearが子孫に継承するというバグではなく、
「clearが設定されている要素の子要素に、対応する方向の
floatを設定しても効かない」というバグだと思います。
継承はしないので孫要素なら問題なしです。
# 某はてなダイアリーはclearを設定した div.body 直下に
# floatを設定した img.photo があるので、スタイルをどう
# いじってもMacIEではフロート出来ないんだな。
930 ：Name_Not_Found：04/03/02 21:42 ID:???
MacIE 確認済みバグ
インラインボックス化したli要素に背景色を設定すると内容物が消える(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b035.html
すいません、もう一度修正をお願いします。
伸びているのは背景ではなくインラインボックスでした。（ボーダーも伸びる。）
あと補足も症状にあわせて修正したほうがいいんじゃないでしょうか。
インラインボックス化したli要素に背景色を設定すると内容物が消える(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b035.html
すいません、もう一度修正をお願いします。
伸びているのは背景ではなくインラインボックスでした。（ボーダーも伸びる。）
あと補足も症状にあわせて修正したほうがいいんじゃないでしょうか。
932 ：Name_Not_Found：04/03/02 22:43 ID:???
>>903
clearを指定したフロートの上下に空行ができる(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b147.html
>不具合が発生している要素の親要素がli要素の場合や
>ボーダーがあるボックスである場合にこの不具合は発生しません。
親要素のpadding-topに0以外の値を指定しても、バグが回避されました。
paddingで四辺一括指定でもいいが、padding-left,padding-right,padding-bottomではなぜか回避できない。
clearを指定したフロートの上下に空行ができる(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b147.html
>不具合が発生している要素の親要素がli要素の場合や
>ボーダーがあるボックスである場合にこの不具合は発生しません。
親要素のpadding-topに0以外の値を指定しても、バグが回避されました。
paddingで四辺一括指定でもいいが、padding-left,padding-right,padding-bottomではなぜか回避できない。
933 ：Name_Not_Found：04/03/02 23:39 ID:???
http://cssbug.at.infoseek.co.jp/detail/winie/b147.html
↑このバグの「補足」のページをIEで見たら、リストマーカーが変な位置に入り込んでますね。
で、調べたらこれ、別のバグなのね。
http://cssbug.at.infoseek.co.jp/detail/winie/b111.html
先頭にフロートがあるリストアイテム要素でリストマーカーが要素内に入り込む(5.x/6.0)
>リストマーカーを持つ要素（li要素など）の内容物の先頭にフロートがあるとき、
>リストマーカーがリストアイテム要素の内部に入り込む。
でもこれ、正確には「先頭にfloat:left;を指定した要素があるとき」とすべきでないかな。
float:right;の場合には起らないでしょ？
↑このバグの「補足」のページをIEで見たら、リストマーカーが変な位置に入り込んでますね。
で、調べたらこれ、別のバグなのね。
http://cssbug.at.infoseek.co.jp/detail/winie/b111.html
先頭にフロートがあるリストアイテム要素でリストマーカーが要素内に入り込む(5.x/6.0)
>リストマーカーを持つ要素（li要素など）の内容物の先頭にフロートがあるとき、
>リストマーカーがリストアイテム要素の内部に入り込む。
でもこれ、正確には「先頭にfloat:left;を指定した要素があるとき」とすべきでないかな。
float:right;の場合には起らないでしょ？
934 ：Name_Not_Found：04/03/03 03:42 ID:???
MacIE 確認済みバグ
インラインボックス化したli要素に背景色を設定すると内容物が消える(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b035.html
どうやらリスト要素以外でも発生するようです。
<div style="text-align:center;">
<a href="../opera.html" style="background:red"><em>Opera</em></a>
</div>
親ブロック要素にtext-alignを指定し、孫インライン要素を含む子インライン要素に背景を指定すると発生する模様。
ちなみに子インライン要素がa要素の場合はa:hover{background:red}とかでも発生します。
インラインボックス化したli要素に背景色を設定すると内容物が消える(5.x)
http://cssbug.at.infoseek.co.jp/detail/macie/b035.html
どうやらリスト要素以外でも発生するようです。
<div style="text-align:center;">
<a href="../opera.html" style="background:red"><em>Opera</em></a>
</div>
親ブロック要素にtext-alignを指定し、孫インライン要素を含む子インライン要素に背景を指定すると発生する模様。
ちなみに子インライン要素がa要素の場合はa:hover{background:red}とかでも発生します。
935 ：Name_Not_Found：04/03/04 00:19 ID:???
html要素にスタイルを設定できない(5.x)
http://cssbug.at.infoseek.co.jp/detail/winie/b142.html
>html要素に対して指定したスタイルはすべて無視される。
>……
>WinIE5.5、WinIE6.0の互換モードで不具合の発生を確認しました。
スタイルすべてではない。
WinIE6.0の互換モードでは例外的に有効となるプロパティがあります。
独自拡張のscrollbar-プロパティーがそれです。
html {scrollbar-face-color: lime;}
これは5.5では無視されても6.0互換モードなら大丈夫。
http://cssbug.at.infoseek.co.jp/detail/winie/b142.html
>html要素に対して指定したスタイルはすべて無視される。
>……
>WinIE5.5、WinIE6.0の互換モードで不具合の発生を確認しました。
スタイルすべてではない。
WinIE6.0の互換モードでは例外的に有効となるプロパティがあります。
独自拡張のscrollbar-プロパティーがそれです。
html {scrollbar-face-color: lime;}
これは5.5では無視されても6.0互換モードなら大丈夫。
936 ：Name_Not_Found：04/03/04 02:56 ID:???
リンク要素の下線より下にはみ出した部分の文字の色を変えられない（Safari1.2）
a:visited { color: purple; }
a:hover { color: green; }
a:active { color: maroon; }
<a href="">jpg</a>
jやgなどの下線より下にはみ出した部分の色が疑似要素による指定で変えられない。
下線を消しても発生する。
a:visited { color: purple; }
a:hover { color: green; }
a:active { color: maroon; }
<a href="">jpg</a>
jやgなどの下線より下にはみ出した部分の色が疑似要素による指定で変えられない。
下線を消しても発生する。
937 ：Name_Not_Found：04/03/04 10:51 ID:???
>>936
a要素以外のインライン要素でtext-decoration:underline;を指定した場合は大丈夫なの？
a要素以外のインライン要素でtext-decoration:underline;を指定した場合は大丈夫なの？
>>937
a要素以外では発生しませんでした。
a要素以外では発生しませんでした。
939 ：Name_Not_Found：04/03/04 14:47 ID:???
Safari 確認済みバグ
caption要素を含むテーブルではcol要素に対するスタイルが効かない(S1.0)
http://cssbug.at.infoseek.co.jp/detail/safari/b008.html
Safari1.2でも確認。
またcol要素だけでなくcolgroup要素でも発生しました。
caption要素を含むテーブルではcol要素に対するスタイルが効かない(S1.0)
http://cssbug.at.infoseek.co.jp/detail/safari/b008.html
Safari1.2でも確認。
またcol要素だけでなくcolgroup要素でも発生しました。
940 ：Name_Not_Found：04/03/04 14:55 ID:???
941 ：Name_Not_Found：04/03/04 15:01 ID:???
2列以上を含むcolgroup要素にwidthが効かない（Safari1.2）
<table border="2">
<colgroup span="2" style="width:7em">
<tr><td>幅7em</td><td>幅7em</td></tr>
</table>
<table border="2">
<colgroup span="2" style="width:7em">
<tr><td>幅7em</td><td>幅7em</td></tr>
</table>
>>940
>疑似要素でなくて擬似クラス
すいません、間違えました。
>フォント（の設計）によって結果が異なるかも
試してみたところ、ヒラギノ系では発生しましたがOsakaでは発生しませんでした。
また斜体したり、筆記体のようなフォントにすると左右にはみ出した部分の色が変わらなくなりました。
>疑似要素でなくて擬似クラス
すいません、間違えました。
>フォント（の設計）によって結果が異なるかも
試してみたところ、ヒラギノ系では発生しましたがOsakaでは発生しませんでした。
また斜体したり、筆記体のようなフォントにすると左右にはみ出した部分の色が変わらなくなりました。
943 ：Name_Not_Found：04/03/04 15:36 ID:???
>>942 欧文フォントでもなりますか。それとも和文（2バイト）フォントだけ？
944 ：Name_Not_Found：04/03/04 15:53 ID:???
>>342
あれ、Safari1.2って、font-family {'ヒラギノ明朝 Pro W3';}とか指定できるの？
名称に日本語文字を含むフォントファミリの指定を無視する(S1.0)
http://cssbug.at.infoseek.co.jp/detail/safari/b003.html
あれ、Safari1.2って、font-family {'ヒラギノ明朝 Pro W3';}とか指定できるの？
名称に日本語文字を含むフォントファミリの指定を無視する(S1.0)
http://cssbug.at.infoseek.co.jp/detail/safari/b003.html
>>943
フォントによります。Times New Romanでは発生しました。
またどの部分から色が変わらなくなるかはフォントによって違うようです。
VT100だと下線どころか中心から下半分の色が変わりません。
>>944
Hiragino Maru Gothic Pro
Hiragino Kaku Gothic Pro
Hiragino Kaku Gothic Std
Hiragino Mincho Pro
と指定するとヒラギノになります。W3といった文字の太さは指定できませんが。
フォントによります。Times New Romanでは発生しました。
またどの部分から色が変わらなくなるかはフォントによって違うようです。
VT100だと下線どころか中心から下半分の色が変わりません。
>>944
Hiragino Maru Gothic Pro
Hiragino Kaku Gothic Pro
Hiragino Kaku Gothic Std
Hiragino Mincho Pro
と指定するとヒラギノになります。W3といった文字の太さは指定できませんが。
946 ：Name_Not_Found：04/03/04 17:01 ID:???
947 ：Name_Not_Found：04/03/04 18:16 ID:???
MozillaFireBird0.7（正式版）で確認したバグらしき挙動です。
HTML
<html>
<head></head>
<body>
<div class="menu">
<div class="content">
〜
</div>
</div>
<div class="foot">
〜
</div>
</body>
</html>
CSS
.menu {float: left; width: 50%;}
.content{margin-top: 1em; margin-bottom: 1em;}
.foot{clear: both; margin-top: 5em;}
以上のように記述すると、<div class="foot">の部分に５文字分マージンが
入るはずなのですが、どうしてもマージンが入りません。
IE6SP1、Opera7.23ではマージンが入りました。また、標準モード/互換モード両方でテストしてみましたが、違いはありませんでした。
ソースはかなり省略してますが、これ以外にこの3つの要素に設定しているプロパティは背景色、文字色、ボーダーのみです。
説明不足かもしれませんが、どなたか確認をお願いいたします。
HTML
<html>
<head></head>
<body>
<div class="menu">
<div class="content">
〜
</div>
</div>
<div class="foot">
〜
</div>
</body>
</html>
CSS
.menu {float: left; width: 50%;}
.content{margin-top: 1em; margin-bottom: 1em;}
.foot{clear: both; margin-top: 5em;}
以上のように記述すると、<div class="foot">の部分に５文字分マージンが
入るはずなのですが、どうしてもマージンが入りません。
IE6SP1、Opera7.23ではマージンが入りました。また、標準モード/互換モード両方でテストしてみましたが、違いはありませんでした。
ソースはかなり省略してますが、これ以外にこの3つの要素に設定しているプロパティは背景色、文字色、ボーダーのみです。
説明不足かもしれませんが、どなたか確認をお願いいたします。
948 ：Name_Not_Found：04/03/04 18:30 ID:???
>>947
それはIEとOperaのバグではないかと。
clearを指定した要素ではフロートに対して上マージンを設置する(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b141.html
clearを指定した要素ではフロートに対して上マージンを設置する(6.0/7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b076.html
それはIEとOperaのバグではないかと。
clearを指定した要素ではフロートに対して上マージンを設置する(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b141.html
clearを指定した要素ではフロートに対して上マージンを設置する(6.0/7.x)
http://cssbug.at.infoseek.co.jp/detail/opera/b076.html
949 ：Name_Not_Found：04/03/04 18:32 ID:???
>>941
col要素でもダメですね。この辺はバグが多そうに思います。
という訳で、以下の5パターンで、他のブラウザでもどうなるか
試してみました。
1. <colgroup span="2" style="width: 7em">
2. <colgroup style="width: 7em"><col span="2"></colgroup>
3. <colgroup style="width: 7em"><col><col></colgroup>
4. <col span="2" style="width: 7em">
5. <col style="width: 7em"><col style="width: 7em">
Safari1.2
→ 3, 5 だけ大丈夫。1, 2, 4 はすべてダメ。
(span属性があるとダメみたい)
MacIE5
→ 4, 5 だけ大丈夫。1, 2, 3 はすべてダメ。
(colgroup要素がダメみたい)
Opera6
→ 5 は大丈夫。
4 は1列だけ効くが2列目以降ダメ。
1, 2, 3 はすべてダメ。
(colgroup要素がダメで、span属性は無視?)
Mozilla
→ 1, 2, 3, 4, 5 すべて全く問題なし。
(さすがと言うべきか)
ま、色んなブラウザを考えると 5 の書き方しかない訳ですが、
WinIE や Opera7 などはどうでしょう?
col要素でもダメですね。この辺はバグが多そうに思います。
という訳で、以下の5パターンで、他のブラウザでもどうなるか
試してみました。
1. <colgroup span="2" style="width: 7em">
2. <colgroup style="width: 7em"><col span="2"></colgroup>
3. <colgroup style="width: 7em"><col><col></colgroup>
4. <col span="2" style="width: 7em">
5. <col style="width: 7em"><col style="width: 7em">
Safari1.2
→ 3, 5 だけ大丈夫。1, 2, 4 はすべてダメ。
(span属性があるとダメみたい)
MacIE5
→ 4, 5 だけ大丈夫。1, 2, 3 はすべてダメ。
(colgroup要素がダメみたい)
Opera6
→ 5 は大丈夫。
4 は1列だけ効くが2列目以降ダメ。
1, 2, 3 はすべてダメ。
(colgroup要素がダメで、span属性は無視?)
Mozilla
→ 1, 2, 3, 4, 5 すべて全く問題なし。
(さすがと言うべきか)
ま、色んなブラウザを考えると 5 の書き方しかない訳ですが、
WinIE や Opera7 などはどうでしょう?
950 ：Name_Not_Found：04/03/04 18:54 ID:???
次スレッドのテンプレート、これでいい？
CSS（とDHTML）のバグ報告、お待ちしてます。
※報告の際はOS・ブラウザ名とそのヴァージョンを明記して下さい。
再現条件をつきとめるため、必要に応じてソースを出して下さい。
これまでのバグは下記に登録されてます（前366◆E3CSS.J95U／◆B7TCOttEさんに感謝）。
【CSSバグリスト＠CSSバグ辞典スレッド】 http://cssbug.at.infoseek.co.jp/
プロパティ別にバグを調べたいときは――
・K@tsukun's PAGE! ＞ CSS対応状況表 （の各プロパティ「関連バグ情報」）
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSSプロパティ別トラブルの索引
http://dhr.at.infoseek.co.jp/stylebug_index1.htm
【バグ説明・回避法などを載せた参考サイトへのリンク】
http://cssbug.at.infoseek.co.jp/link.html
【過去ログ】
・CSS、DHTMLバグ辞典スレッド
http://mentai.2ch.net/hp/kako/987/987003410.html
・CSS/DHTMLバグ辞典スレッド ver2.0
http://pc2.2ch.net/test/read.cgi/hp/991666454/l50
・CSS/DHTMLバグ辞典スレッド 第３版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
【関聯スレッド】
・/* CSS・スタイルシート質問スレッド*/
http://web2ch.s31.xrea.com:8080/?CSSLog
・代替スタイルシートに萌え〜
http://pc2.2ch.net/test/read.cgi/hp/991400015/l50
・独自拡張、草案段階のCSSについて語れ
http://pc2.2ch.net/test/read.cgi/hp/1019912046/l50
その他あれば、>>2-5あたりで。
CSS（とDHTML）のバグ報告、お待ちしてます。
※報告の際はOS・ブラウザ名とそのヴァージョンを明記して下さい。
再現条件をつきとめるため、必要に応じてソースを出して下さい。
これまでのバグは下記に登録されてます（前366◆E3CSS.J95U／◆B7TCOttEさんに感謝）。
【CSSバグリスト＠CSSバグ辞典スレッド】 http://cssbug.at.infoseek.co.jp/
プロパティ別にバグを調べたいときは――
・K@tsukun's PAGE! ＞ CSS対応状況表 （の各プロパティ「関連バグ情報」）
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSSプロパティ別トラブルの索引
http://dhr.at.infoseek.co.jp/stylebug_index1.htm
【バグ説明・回避法などを載せた参考サイトへのリンク】
http://cssbug.at.infoseek.co.jp/link.html
【過去ログ】
・CSS、DHTMLバグ辞典スレッド
http://mentai.2ch.net/hp/kako/987/987003410.html
・CSS/DHTMLバグ辞典スレッド ver2.0
http://pc2.2ch.net/test/read.cgi/hp/991666454/l50
・CSS/DHTMLバグ辞典スレッド 第３版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
【関聯スレッド】
・/* CSS・スタイルシート質問スレッド*/
http://web2ch.s31.xrea.com:8080/?CSSLog
・代替スタイルシートに萌え〜
http://pc2.2ch.net/test/read.cgi/hp/991400015/l50
・独自拡張、草案段階のCSSについて語れ
http://pc2.2ch.net/test/read.cgi/hp/1019912046/l50
その他あれば、>>2-5あたりで。
951 ：Name_Not_Found：04/03/04 19:11 ID:???
952 ：Name_Not_Found：04/03/04 21:58 ID:???
CSS バグリスト、未確認 [2-603]
> ブロック化したアンカーの範囲が内容物の部分のみになる(IE5.5)
ですが、IE5.5、IE6.0 両方で確認しました。
再現条件は <div id="navi"><ul><li><a href・・・・ /a></li></ul></div> だとして、
div が float であることです。
なお、a 要素に width: 100% を設定すると回避できるとありますが、
a 要素に padding が設定してあると Gecko 系や Opera で padding 幅分
親 BOX をはみ出します。
また、IE であっても li が複数ある場合、
マウスポインタの位置によってリスト下のマージンが消失したり現れたりします。
こちらで検証した回避策は、ブロック化した a 要素に
position: rerative を指定する事です。
ただし、この策にも欠点があり (IE5.5 の場合・・・・IE6.0 では OK)
white-space: nowrap が指定してあると、ブロック化した a 要素の
頭が padding 分だけ描画されません。
どうしても white-space: nowrap を指定したい場合は
a 要素の親に padding、または border を指定します。
検証ソースは次のレスに記載します。
> ブロック化したアンカーの範囲が内容物の部分のみになる(IE5.5)
ですが、IE5.5、IE6.0 両方で確認しました。
再現条件は <div id="navi"><ul><li><a href・・・・ /a></li></ul></div> だとして、
div が float であることです。
なお、a 要素に width: 100% を設定すると回避できるとありますが、
a 要素に padding が設定してあると Gecko 系や Opera で padding 幅分
親 BOX をはみ出します。
また、IE であっても li が複数ある場合、
マウスポインタの位置によってリスト下のマージンが消失したり現れたりします。
こちらで検証した回避策は、ブロック化した a 要素に
position: rerative を指定する事です。
ただし、この策にも欠点があり (IE5.5 の場合・・・・IE6.0 では OK)
white-space: nowrap が指定してあると、ブロック化した a 要素の
頭が padding 分だけ描画されません。
どうしても white-space: nowrap を指定したい場合は
a 要素の親に padding、または border を指定します。
検証ソースは次のレスに記載します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>バグチェック - CSS</title>
<style type="text/css">
#Test { width: 50%; float: left; color: #000; background-color: #666;
border-style: solid; border-width: 1px; border-color: #000;
/* white-space: nowrap; */
}
ul { color: #000; background: #666; }
li {
/* padding: 1px; */
/* border-style: solid; border-width: 1px; */
}
h2 {
/* padding: 1px; */
/* border-style: solid; border-width: 1px; */
}
a { display: block; text-decoration: none; color: #000; background: #CCC;
border-width: 1px; border-style: solid; border-color: #080;
padding-left: 1em;
/* position: relative; */
/* width: 100%; */
}
a:hover { color: #000; background: #FFF; border-color: #F00; }
</style>
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>バグチェック - CSS</title>
<style type="text/css">
#Test { width: 50%; float: left; color: #000; background-color: #666;
border-style: solid; border-width: 1px; border-color: #000;
/* white-space: nowrap; */
}
ul { color: #000; background: #666; }
li {
/* padding: 1px; */
/* border-style: solid; border-width: 1px; */
}
h2 {
/* padding: 1px; */
/* border-style: solid; border-width: 1px; */
}
a { display: block; text-decoration: none; color: #000; background: #CCC;
border-width: 1px; border-style: solid; border-color: #080;
padding-left: 1em;
/* position: relative; */
/* width: 100%; */
}
a:hover { color: #000; background: #FFF; border-color: #F00; }
</style>
</head>
<body>
<h1>A 要素のブロック化におけるバグ</h1>
<div id="Test">
<h2><a href="#">TEST</a></h2>
<ul><li><a href="#">JumpJump 1</a></li><li><a href="#">Jump 2</a></li></ul>
</div>
</body>
</html>
以上。
<body>
<h1>A 要素のブロック化におけるバグ</h1>
<div id="Test">
<h2><a href="#">TEST</a></h2>
<ul><li><a href="#">JumpJump 1</a></li><li><a href="#">Jump 2</a></li></ul>
</div>
</body>
</html>
以上。
955 ：Name_Not_Found：04/03/04 22:43 ID:???
caption要素があるとcol要素およびcolgroup要素にtext-alignが効かない（MacIE5.x）
<table>
<caption>text-align:rightを指定</caption>
<col span="2" style="text-align:right;width:7em">
<tr><th>右寄せ</th><th>右寄せ</th></tr>
<tr><td>右寄せ</td><td>右寄せ</td></tr>
</table>
<table>
<caption>text-align:rightを指定</caption>
<col span="2" style="text-align:right;width:7em">
<tr><th>右寄せ</th><th>右寄せ</th></tr>
<tr><td>右寄せ</td><td>右寄せ</td></tr>
</table>
956 ：Name_Not_Found：04/03/04 22:47 ID:???
>>955
効かないのが正当。captionが無ければ効くのならそっちがバグ。
効かないのが正当。captionが無ければ効くのならそっちがバグ。
957 ：Name_Not_Found：04/03/04 22:51 ID:???
colgroup要素にtext-alignが効かない（Safari1.2）
<table>
<colgroup style="text-align:right;width:7em"><col><col></colgroup>
<tr><th>右寄せ</th><th>右寄せ</th></tr>
<tr><td>右寄せ</td><td>右寄せ</td></tr>
</table>
<table>
<colgroup style="text-align:right;width:7em"><col><col></colgroup>
<tr><th>右寄せ</th><th>右寄せ</th></tr>
<tr><td>右寄せ</td><td>右寄せ</td></tr>
</table>
tbody要素とtfoot要素の背景を塗る場所を間違える。（MacIE5.x）
tfoot、tbodyの順に背景が塗られてしまう。
<table>
<thead><tr><th>thead</th><th>thead</th></tr></thead>
<tfoot style="background:red"><tr><td>tfoot赤</td><td>tfoot赤</td></tr></tfoot>
<tbody style="background:blue"><tr><td>tbody青</td><td>tbody青</td></tr></tbody>
</table>
tfoot、tbodyの順に背景が塗られてしまう。
<table>
<thead><tr><th>thead</th><th>thead</th></tr></thead>
<tfoot style="background:red"><tr><td>tfoot赤</td><td>tfoot赤</td></tr></tfoot>
<tbody style="background:blue"><tr><td>tbody青</td><td>tbody青</td></tr></tbody>
</table>
>>952
追加です。
div を absolute 指定した場合 (float 指定無し) も発生します。
回避方法は text-align が right 以外の場合のみ同じです。
text-align: right での回避は今の所不明です。
なお、>>952 に書き忘れましたが OS は Win 系 です。
追加です。
div を absolute 指定した場合 (float 指定無し) も発生します。
回避方法は text-align が right 以外の場合のみ同じです。
text-align: right での回避は今の所不明です。
なお、>>952 に書き忘れましたが OS は Win 系 です。
961 ：Name_Not_Found：04/03/05 14:22 ID:???
新スレッド、立てておきました。
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
こちらもまだしばらく参照できた方がいいわけですから、
故意に埋めないで自然に沈むまま残しておいて下さい。
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
こちらもまだしばらく参照できた方がいいわけですから、
故意に埋めないで自然に沈むまま残しておいて下さい。
962 ：Name_Not_Found：04/03/05 22:01 ID:???
963 ：Name_Not_Found：04/03/06 04:56 ID:???
>>949 の件を検証していて気づいたことですが、
<table border="1">
<colgroup style="width:30em"></colgroup>
<colgroup style="width:7em"><col><col></colgroup>
<tr><td>30em</td><td>7em</td><td>7em</td></tr>
</table>
この場合、一列目は30em幅で二列目と三列目は7em幅になる
はずです。実際、Mozillaではそのように正しく表示されます。
MacIE5やOpera6は >>949 にある通り、colgroup要素への
列幅スタイルが全く効きませんので、全てauto幅で表示されて
しまいます。
つづく
<table border="1">
<colgroup style="width:30em"></colgroup>
<colgroup style="width:7em"><col><col></colgroup>
<tr><td>30em</td><td>7em</td><td>7em</td></tr>
</table>
この場合、一列目は30em幅で二列目と三列目は7em幅になる
はずです。実際、Mozillaではそのように正しく表示されます。
MacIE5やOpera6は >>949 にある通り、colgroup要素への
列幅スタイルが全く効きませんので、全てauto幅で表示されて
しまいます。
つづく
964 ：Name_Not_Found：04/03/06 04:57 ID:???
つづき
問題はSafariで、なんと一列目と二列目が7em幅で三列目が
auto幅になってしまいます。実はこれ、
<colgroup style="width:30em"><col></colgroup>
<colgroup style="width:7em"><col><col></colgroup>
と書くと正しく表示してくれます。ここから、Safariは、
「colgroup要素があると、そこに指定されているスタイルを、
それ以後に出てくるcol要素に割り当てていく。その後、
各col要素に従って各列のスタイルを決める」
というアルゴリズムになっているのではないかと考えられます。
つまり、colgroup/col の親子関係を見ずに、出現順序だけ見て
いる感じ。
そのため、col要素を持たないcolgroup要素があると、スタイル
の適応される列がずれてしまうんだと思います。
問題はSafariで、なんと一列目と二列目が7em幅で三列目が
auto幅になってしまいます。実はこれ、
<colgroup style="width:30em"><col></colgroup>
<colgroup style="width:7em"><col><col></colgroup>
と書くと正しく表示してくれます。ここから、Safariは、
「colgroup要素があると、そこに指定されているスタイルを、
それ以後に出てくるcol要素に割り当てていく。その後、
各col要素に従って各列のスタイルを決める」
というアルゴリズムになっているのではないかと考えられます。
つまり、colgroup/col の親子関係を見ずに、出現順序だけ見て
いる感じ。
そのため、col要素を持たないcolgroup要素があると、スタイル
の適応される列がずれてしまうんだと思います。
965 ：Name_Not_Found：04/03/08 19:07 ID:???
新スレッド
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
CSSバグリスト＠CSSバグ辞典スレッド
http://cssbug.at.infoseek.co.jp/index.html
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
CSSバグリスト＠CSSバグ辞典スレッド
http://cssbug.at.infoseek.co.jp/index.html
966 ：Name_Not_Found：04/03/22 14:47 ID:???
さっさと埋めてHTML化させたほうがいいんじゃないのか？
967 ：Name_Not_Found：04/03/23 00:54 ID:???
じゃあ埋め。
968 ：Name_Not_Found：04/03/23 09:43 ID:???
新スレッド
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
CSSバグリスト＠CSSバグ辞典スレッド
http://cssbug.at.infoseek.co.jp/index.html
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
CSSバグリスト＠CSSバグ辞典スレッド
http://cssbug.at.infoseek.co.jp/index.html
969 ：Name_Not_Found：04/03/29 03:51 ID:???
復活！
970 ：Name_Not_Found：04/03/29 10:26 ID:KUtp7yco
特に問題なさそうだ
971 ：Name_Not_Found：04/03/29 10:55 ID:???
新スレッド
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
CSSバグリスト＠CSSバグ辞典スレッド
http://cssbug.at.infoseek.co.jp/index.html
CSS/DHTMLバグ辞典スレッド 第４版
http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50
CSSバグリスト＠CSSバグ辞典スレッド
http://cssbug.at.infoseek.co.jp/index.html
972 ：Name_Not_Found：04/03/29 10:57 ID:???
973 ：Name_Not_Found：04/04/29 21:02 ID:???
(ﾟдﾟ)ｳﾏｰ
974 ：Name_Not_Found：04/04/30 17:08 ID:???
（ﾟДﾟ）ﾊｧ?
975 ：Name_Not_Found：04/04/30 17:19 ID:???
>>974
(ﾟдﾟ)ｳﾒｪんだよ!
(ﾟдﾟ)ｳﾒｪんだよ!
976 ：Name_Not_Found：04/04/30 17:29 ID:???
（ﾟДﾟ）ﾊｧ?
977 ：Name_Not_Found：04/05/01 00:59 ID:???
ごめん
978 ：Name_Not_Found：04/05/01 05:13 ID:???
(ﾟдﾟ)ｼﾒｼﾞ
979 ：Name_Not_Found：04/05/01 07:48 ID:???
（ﾟДﾟ）ﾊｧ?
ｷﾉｺｯﾉｰｺﾉｺｹﾞﾝｷﾉｺ
ｴﾘﾝｰｷﾞﾏｲﾀｹ...
ｴﾘﾝｰｷﾞﾏｲﾀｹ...