CSS/DHTMLバグ辞典スレッド【第５版】
質問です（既出だったら済みません）。
【環境】Windows XPのNN7,IE6,Opera,FireFox
CSSで、<body>と<blockquote>にプロポーショナルフォントを指定しても
<blockquote>内にそれが適用されず、等幅フォントで表示されてしまいます。
さらには、明朝・serif系フォントを指定しても、
ブラウザのデフォルトのゴシック系のままです。
line-heightやbackground-color,marginの指定は反映されるようです。
他の<h*>や<p>などでマークアップした文章には
<body>で指定したフォントが反映されています。
分かる方、お願いします…… >>101
仕様通りの動作です！
<pre>
PRE要素は、同等フォントで表示されます。
<b>太字要素</b>や<big>大きい文字要素</big>は無視されるはずです。
</pre> >>102
そうか、ありがとう。
読みにくいけど仕方ないか。 過疎ッてるしいまの所はいいんじゃね。
104は責任とってバグを報告を活発にして盛り上げヨロ。 質問です。
【環境】Win XP / Firefox1.5.x Opera8.x NN7.1
<div style="width: 800px; margin: 0px; padding: 0px; background: url(img/maincontents-bg.gif);">
<div style="width: 589px; margin: 0px; padding: 0px; float: left;">left</div>
<div style="width: 210px; margin: 0px; padding: 0px; float: right;">right</div>
</div>
親要素に背景画像を指定して、子要素にfloat属性があると、親要素の
背景画像が表示されません。
既出でつか？
背景画像で罫線を入れたいんです。
子要素の左右どちらかにborder属性を指定すれば良いのでしょうが、
ページによって左右の高さが変わるので、親要素の背景画像として
対応できればと思っています。 自己レスです。
親要素にheightを指定すれば良いみたいです。
んでも、子要素の高さはなり行きなんですよねー。
結局、子要素にborderをしていするしかないんですかねぇ。。。
皆さんはどうしてます？ >>107
親要素の:afterでclear: bothと、MacIEのみに適用するようにして親要素にdisplay: inline-tableと、バックスラッシュハックとスターハックを組み合わせてから親要素にheight: 1pxじゃなかった？
基礎だけど。詳しくは「"position is everything" float」でGoogleへ。
というか、質問スレじゃないだろ。答えてる俺が悪いんだが。 IE7です。
<ul><li><dl><dt>dt</dt><dd>dd</dd></dl></li>
<li><ol><li>li</li><li>li</li></ol></li></ul>
リストを入れ子にすると１行目(リストマーカーの右)に余白が空きます。
「li要素の子孫にリスト要素があるとリストマークが上方にずれる」
http://cssbug.at.infoseek.co.jp/detail/winie/b028.html
これと同様の現象だと思うんですけど、IE7では「補足」の方法では回避できません。
これ、バグだとすると、かなり致命的なバグだと思うんですけど…
エラーログを見ていたのだけど、MacIE5がCSSの画像関係で物凄い数のエラーを吐いていたのね。
よく見てみると要求しているURLが、「CSSファイルのあるディレクトリ」+「画像指定のurl()のカッコ内の内容」になっていました。
http://cssbug.at.infoseek.co.jp/detail/macie/b021.html
上記URL先の場合だと、「/cssのあるディレクトリ/../images/hoge.jpg」と要求しているようです。
これを回避するにはcssのあるディレクトリ以下に画像を置いて、url(images/hoge.jpg) と記述するといいのでは？
（一応スレ内MacIE5で検索したのですが、ガイシュツでしたらすまそ。） 114の文章力なさすぎで鬱。
MacIE5で指定した背景画像が表示されない問題についてです。 >>115
＞MacIE5で指定した背景画像が表示されない問題
そんな問題が起こった事はないんだが。
どういう条件下なのかちゃんと書いてくれ。 >>116
条件は「CSSのおいてあるディレクトリ以下にない画像を相対URLで指定した場合」、
「url('hoge.jpg')のようにコンマを入れた場合」です。（Mac持っていないので多分…）
/css/style.css
/images/hoge.jpg
という階層の場合、
background-image:url('../images/hoge.jpg');と記述しますが、
MacIEはサーバーにこの画像の場所を/css/'../images/hoge.jpg' ←カッコの中身そのまんま
と要求してくるため、画像が表示されないのかと…。
/css/style.css
/css/images/hoge.jpg
という階層にして、
background-image:url(images/hoge.jpg);と記述すれば、画像が出そうだなと。
まとめサイトに解決策がなかったので一応。 「簡略化プロパティを認識しない。」とまとめサイトにあるので、
もしかしたら下のケースだけかもしれません。何度もすみません。
background-image:url('../images/hoge.jpg');
background:url('../images/hoge.jpg'); それってこれも絡んでるんじゃないの
ttp://cssbug.at.infoseek.co.jp/detail/macie/b047.html >>119
なるほどー。では相対URLで指定してもダブルクォーテーションで囲んだ
場合はMACIE5なら認識しそうな感じがしてきました。ありがとん。 >>120
認識しないって書いてあるよ。
大昔はいざ知らず、今は’も”も付けないのが普通なんだし、
ましてやﾕｰｻﾞｰでも無いのに、何大騒ぎしてんのさ。 叩かれないようにって気をつけて書いたんだけど、
ヤッパリ叩かれてしまったなー。
エラーログが流れてしまうから、エラー吐かせたくなかったのね。
一応119には、『「MacIE4.5」はURIをダブルクォーテーションで
括った場合もこの指定を認識しない。』とあったから、MacIE5なら
OKだとおもただけだよ。結局は引用符つけない方法とったけどね。 すいません質問ですが
ul.wisp li {
display: inline;
white-space: nowrap;
}
という記述のもと、
<ul> という記述の元
<ul>
<li>***</li>
<li>***</li>
<li>***</li>
<li>***</li>
</ul>
というように書きました。
するとブラウザIE6にて、特定のウィンドウサイズにした際に****が表示されないときがあります。
コピペはできるので、テキストは存在するのですが、表示されなくなるようです。
これの原因か、もしくは解説しているサイトがあれば教えていただけないでしょうか。 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝
ここは質問スレじゃありません
＝＝＝＝＝＝＝＝＝＝＝＝＝＝ 書き込んでから気づきました
本当にごめんなさい。
>>1見て、自分で色々やってみることにします。
どうも失礼しました。 こんにちは。CSS質問スレで誘導されたのでこちらに書き込みます。
IE6とFirefox2.0で下のHTMLを表示させると
IE6ではtableの高さがウィンドウサイズになり、
FFではtableの高さがdivの高さ=1600pxになるようですが、
CSSの仕様的にはどちらの挙動が正しいんでしょうか？ （UA依存？）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html style="height:100%">
<body style="margin:0px;height:100%">
<table style="height:100%" cellspacing=0 cellpadding=0>
<tr style="height:100%">
<td valign=middle>TEXT</td>
<td style="height:100%">
<div style="height:100%;overflow:scroll">
<div style="background-color:red;width:100px;height:1600px">RED BOX</div>
</div>
</td>
</tr>
</table>
</body></html> CSSスレ61の989だが、ここはあくまでバグを
報告する場であって質問をする場ではないよ。
報告されたのが本当にバグかどうかを検証するために
仕様書解釈の話をすることならあるかもしれないけど。
質問ならCSSスレのほうが適してるでしょ。 , -ｪェェiiェェｪ-､
.l f＾''' ｰ - ‐ ''' ＾l i
l ,' ‐-‐ ','!
| l へ､‐-‐,.へ l | 質問には一切お答え出来ません････！
Lｌ -‐｡=, '=｡‐,-.L|
,.{ﾋ| ｀ ´| |｀ ´ .|ﾋ}､
＿ ,. -‐|.`-l /_〈＿〉_'､ !-’|ｰ- ､ ＿
, -‐ ´ ＿ , -‐|. l. l‘-―‐-’! | |ｰ- ＿ ｀ ｰ- 、
i |-‐ ´ | |｀ｰ- ﾆ - ‐' ! | ｀ ｰ-|ヽ
! | | .| >< | | | l >>131 >>132
了解しました。。では当該スレに戻ります。お騒がせしました。 >>133
変な誘導した奴がいかんのだろ。
61thの最後の方で一応回答しといたよ。 WinのIE 7を含む全てのIEでのバグ
IEではsup, sub要素に font-size: 100% とすると
他のUAよりも小さくなる(実質、他のブラウザの83%くらい)
これは既知の事実だと思う
で、いったんfont-size: 100%とリセットした後、
再びsup, sub要素に font-size: 120% とすると 文字サイズが極端に小さくなる。
なぜか 119% や 121% だと通常通りになる
bodyのfont-sizeの定義にもよるようだ
IE7は small IE5-IE6互換はx-small にしている
この不可解なバグ なんとかならないか
バグ辞典の２倍くらいのバグがあるんじゃないか ちょっと発現例がまださだかではないんだが、
とりあえず、Win IE 7では次のような場合に発現する
* {
font-size: 100%;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: small;
}
sub {
font-size: 120%;
}
<p>テストテストテストテストテスト</p>
<sub>テストテストテストテストテスト</sub>
sub の font-size を 120% 意外にすると、正常になる・・・・ それ、バグだね
font-sizeごとにsubとsupの基準サイズが固定されてたと思う imgタグが勝手にbugに置き換わるんだが
これはバグなのか？ 【環境】WinXPSP2 IE 7.0
【現象】XML 宣言とDOCTYPE 宣言の間にコメントを入れると
セレクタが IE 6 相当になる？
【ソース】
●二行目のコメントの有無が子供セレクタの解釈に影響する
<?xml version="1.0" encoding="UTF-8"?>
<!-- IE 7 のセレクタを殺す -->
<!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"; xml:lang="ja">
<head>
<title>てすと（セレクタが IE 6 相当になる？）</title>
<style type="text/css"><!--
body #test
{
color: white;
background-color: red;
}
body > #test
{
background-color: green;
}
--></style>
</head>
<body><p id="test">てすと（セレクタが IE 6 相当になる？）</p></body></html>
標準モードか互換モードかは調べていませんが、
IE 7 はバグも進化しているようですね。 sageちゃった。なので一応補足。
＊コメント行をとれば緑になる。ちなみに他のブラウザならコメント行があっても緑になる。
＊他のセレクタもこうなるのかは確認していない。
＊あと、IEの独自仕様については何も知らないので。 >>142
IE独自仕様以前に文法違反。
XHTMLでstyleタグにコメント入れてどうするんだ。 >>142
それ単にQuirksモードになってるだけだろ。
IE6ではXML宣言もDOCTYPE宣言も「コメント」として扱い、
最初に登場する「コメント」の内容が特定のDOCTYPE宣言っぽかったら
Strictモードになるという処理だった。だからIE6でも
DOCTYPE宣言の前にコメントを入れればQuirksモードになる。
IE7では最初にXML宣言っぽいものが登場したらそれを
無視するようになったが、DOCTYPE宣言を「コメント」として扱い、
最初に登場する「コメント」の内容でStandardモードにするか
Quirksモードにするか決めるのは変わらないみたいだから、
DOCTYPE宣言の前にコメントを入れればQuirksモードになる。 >>145
XHTMLではSTYLEの内容が #PCDATA >146
http://blogs.msdn.com/ie/archive/2005/09/02/460115.aspx
>the new selectors only match in strict mode
IE 7 で実装されたセレクタは、IE 7 の互換モードだと無視されるんですね。
>144
>145
>147
外部スタイルシートにします。
>144-148
誤って私のバグを晒してしまいました。すれ違いですね。失礼しました。
IE6で・・・・
<div id="main">
<h2>Title 1</h2>
<ul>
<li>あああああ</li>
<li>いいいいい</li>
</ul>
</div>
と入力すれば・・・
Title 1
・ ああああああ
・ いいいいいい
となるはずなのに、IE6だと・・・
Title1
ああああああ
いいいいいい
となります。これはバグでしょうか。
XHTML 1.0 Strictです。
CSSを適用しなければ大丈夫です。 > CSSを適用しなければ大丈夫です。
そりゃCSSがおかしいんだろ
ついでに言うとここは質問スレではありません。
バグかもしれないと思ったら検証してきてください。 >>153
デフォルトがマージンかパディングかの違い、だったけ？
お前の存在がバグだと言う事には気がついていない様だな ＤＩＶ要素に枠線つけて、
その中にＬＩ要素のリストを入れて、
行間を狭くしようと思ってＣＳＳで設定したら、
何故か枠線に繋がるような下線が引かれてしまいました･･･
<HTML><HEAD><TITLE>test</TITLE><STYLE TYPE="text/css">
<!--
DIV{
border-width:thin;
border-style:solid;
border-color:#000000;}
UL{
margin-bottom:-10px;}
LI{
margin-bottom:-2px;
}
--></STYLE></HEAD>
<BODY>
<DIV>
挨拶一覧
<UL>
<LI>おはようございます</LI><LI>こんにちわ</LI><LI>こんばんわ</LI><LI>おやすみなさい</LI></UL>
</DIV></BODY></HTML>
こうなってしまう理由はわからないのですが、
この問題は、ＤＩＶ要素の変わりにTABLE要素を使うことで、一応片付けています。
ＤＩＶ要素使えないのかな･･･？
auのブラウザでフォントサイズの解釈がおかしい。
例えば、
<body>
<h1>見出し</h1>
<p>文章</p>
</body>
というHTMLにCSSで
h1,p{
font-size:100%;
}
と指定されているとh1要素もp要素も親であるbody要素と同じフォントサイズになるはずだが、
こいつは各々の要素のデフォルトフォントサイズを基準に解釈しているようで、
h1要素の方が大きく表示されてしまう。
Mobile Browser 6.2.0.10.4 (KDDI-HI36) Universal Edition 携帯のCSS対応の不備をいちいち論ってたら本来のレスが埋もれるだろ em単位で指定した字間をbody要素の文字サイズを基準に算出する
ttp://cssbug.at.infoseek.co.jp/detail/winie/b109.html
に書いてある内容って本当にバグかね？
1emが
IE=半角
NN=全角
なだけでは？
全角計算が正しいなら、それはそれでバグだけど．．． >>163
・・・・emは文字の「1文字分の高さ」。
だから全角だろうと半角だろうと関係ない。
現在ＨＰを公開してるんですが
内容が企業秘密的な内容があるため
日本国内にいる人のみ見てもらえるようにしたいです
ですが、初心者なのでどのようにすればいいか分かりません
教えてください 166
htmlに「日本国内にいる人のみ見てください。それ以外の人は帰ってください」
>>166
初心者がそんな企業秘密事項を扱うなよｗ
あ、釣られちゃった？ｗ バグuzeeeeeeeeeeeeeeeeeeeee めずらしくFirefox 2.0.0.1でのバグらしき動作
iframeのz-indexが効かない(実際にはJavaScriptで出力)
その他のプロパティは効くんだが
z-indexだけが無視される
<div style="position: absolute; z-index: 2; top: 0; left: 0; width: 100px; height: 100px;">
ボックス１
</div>
<div style="position: absolute; z-index: 0; top: 20px; left: 20px; width: 100px; height: 100px;">
ボックス２
</div>
<div style="position: absolute; z-index: 1; top: 40px; left: 40px; width: 100px; height: 100px;">
ボックス３
</div>
<iframe src="〜" style="position: absolute; z-index: 3; top: 60px; left: 60px; width: 100px; height: 100px;">
</iframe>
この場合、iframeが一番上に来るはずなのになぜか一番下にくる すまそ
>>171のままでは発生しない
実際にはposition: relative; と absolute;を持つ要素が親にある
もう一度試してみるわ 再現できた
iframeのz-indexがきかない
A, Bのoverflowを消すと効く
<div style="position: relative;">
<div style="position: relative; width: 800px; height: 100px; background-color: #0f0;">
ボックス2-1(緑)
</div>
<div style="position: absolute; top: 0; left: 0; width: 800px; height: 20px; background-color: #f00;">
ボックス2-2(赤)
</div>
<div style="overflow: hidden; border: 4px solid #000; width: 800px;"> <!-- A -->
<div style="overflow: auto;"> <!-- B -->
<p>段落段落段落段落段落段落段落段落段落段落</p>
<iframe src="〜" style="position: absolute; z-index: 9999; top: 0; left: 0; width: 100px; height: 100px;">
</iframe>
</div>
</div>
</div> というか仕様通りか
FirefoxじゃなくてIEのバグだな 絶対配置された要素もoverflowの対象なんだっけか？
Firefoxのバグじゃないか？
それとも仕様書には書いてないのか？ >>175
CSS2.1だとoverflowの例に
・A descendent box is positioned absolutely, partly outside the box.
http://www.w3.org/TR/CSS21/visufx.html#overflow-clipping
とある。Operaもiframeを表示するけど、これはAがoverflow:hiddenなんだか
らFirefoxが正しいんでは。 これで再現できる。iframeは関係ないな。
<div style="position:relative">
<div style="background:blue; position:relative; border:4px solid blue; width:400px; height:200px">
blue box
</div>
<div style="overflow:hidden; border:4px solid red; width:400px">
<div style="background:green; z-index:9999; position:absolute; top:0; left:0; width:100px; height:100px">
green box
</div>
</div>
</div>
Opera9でvertical-align:text-bottomを指定すると、親ボックスが縦に長くなる。
これってバグだよね。
<div style="font-size:30px; border:1px solid red">
SAMPLE
<span style="vertical-align:text-bottom; font-size:10px;border:1px solid blue">SAMPLE</span>
</div>
>>179
なぜ？CSS 2とCSS 2.1で定義が違うみたいだが、どっちにしても>>178のソー
スで親ボックスが拡張されるとは考えられないんだが。
CSS 2
> Align the bottom of the box with the bottom of the parent element's font.
http://www.w3.org/TR/REC-CSS2/visudet.html#propdef-vertical-align
CSS 2.1
> Align the bottom of the box with the bottom of the parent's content area
http://www.w3.org/TR/2006/WD-CSS21-20061106/visudet.html#propdef-vertical-align paddin.comの中の人いる？サーバは落ちてるだけ？ 既出かもしれんが、Firefox 2.0でbody要素のボックスの下に謎の空白が出現
するバグを確認。
<body style="border: 4px solid red; padding: 0">
<div style="border: 4px solid blue">
<p>TEST</p>
</div>
</body> >>182
2.0.0.3で何も問題がない。
つーかbody要素のボックスの下って何。 ごめん、ユーザースタイルシートが原因だった。スレ汚しすまん。 186 名前：182[sage] 投稿日：2007/03/22(木) 20:47:39 ID:???
ごめん、ユーザースタイルシートが原因だった。スレ汚しすまん。
186 名前：182[sage] 投稿日：2007/03/22(木) 20:47:39 ID:???
ごめん、ユーザースタイルシートが原因だった。スレ汚しすまん。
186 名前：182[sage] 投稿日：2007/03/22(木) 20:47:39 ID:???
ごめん、ユーザースタイルシートが原因だった。スレ汚しすまん。
ｍ９(＾д＾)ﾌﾟｷﾞｬｰ 【Firefox2.0.0.3】
代替スタイルシートを変更し続けていると
たまにfirst-letter擬似要素の設定が無視される。
検証要素：h1:first-letter - color, fint-size, font-family >>188
h1:first-letterにcolorプロパティを設定して代替スタイルシートの切り替えを
50回やってみたけど再現しなかったよ。
Mozilla/5.0 (X11; U; Linux i686; ja; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy) XPのFx2.0.0.3で逆にfirst-letterの指定が
その後のブロック要素閉じ部分まで設定されてたことが >>188
再現できた。しかし、どういう状況で再現するのかが分からん。 たまに、ということだったらAPIかもしれんね。
Fxも昔からhover関係のfirst-letterは修正されてないから
まだバグ持ちなのかもしれないけど。 http://cssbug.at.infoseek.co.jp/detail/winie/b032.html
このバグがXPの6.0.2900.2180ではなくなってる。いつのまになくなったのかはわからない。
2000の6.0.2800.1106ではまだ起こってる。但し
消えた文字の部分を何度か選択するアクションを取ると文字が出る。意味不明。 >>193
6.0.2900.2180_xpsp2だけど出るよ。 マジ？ xpsp2だよ。
他の人も頼んます・・・orz >>193
うちも出たよ。
6.0.2900.2180 xpsp2 >>193
うちでも発現した。(XP SP2 + IE6) 書き忘れたけど、IEのバージョンは6.0.2800.1106
一人バグ対処ということで下げます・・・どうもですorz
でも出ねえええええええ！ >>193
zoom:100%で回避できるんでないか? 
