931 :
908:04/03/02 22:07 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}とかでも発生します。
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互換モードなら大丈夫。
リンク要素の下線より下にはみ出した部分の文字の色を変えられない(Safari1.2)
a:visited { color: purple; }
a:hover { color: green; }
a:active { color: maroon; }
<a href="">jpg</a>
jやgなどの下線より下にはみ出した部分の色が疑似要素による指定で変えられない。
下線を消しても発生する。
>>936 a要素以外のインライン要素でtext-decoration:underline;を指定した場合は大丈夫なの?
938 :
936:04/03/04 14:30 ID:???
>>936 疑似要素でなくて擬似クラスでは。
あと、ベースラインの位置とディセントの値によるはずだから
フォント(の設計)によって結果が異なるかもね。
2列以上を含むcolgroup要素にwidthが効かない(Safari1.2)
<table border="2">
<colgroup span="2" style="width:7em">
<tr><td>幅7em</td><td>幅7em</td></tr>
</table>
942 :
936:04/03/04 15:18 ID:???
>>940 >疑似要素でなくて擬似クラス
すいません、間違えました。
>フォント(の設計)によって結果が異なるかも
試してみたところ、ヒラギノ系では発生しましたがOsakaでは発生しませんでした。
また斜体したり、筆記体のようなフォントにすると左右にはみ出した部分の色が変わらなくなりました。
>>942 欧文フォントでもなりますか。それとも和文(2バイト)フォントだけ?
945 :
936:04/03/04 16:18 ID:???
>>943 フォントによります。Times New Romanでは発生しました。
またどの部分から色が変わらなくなるかはフォントによって違うようです。
VT100だと下線どころか中心から下半分の色が変わりません。
>>944 Hiragino Maru Gothic Pro
Hiragino Kaku Gothic Pro
Hiragino Kaku Gothic Std
Hiragino Mincho Pro
と指定するとヒラギノになります。W3といった文字の太さは指定できませんが。
>>944 面倒だが,エスケープするという手もある。
font-family: "\30D2\30E9\30AE\30CE\660E\671D\20Pro", serif;
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">の部分に5文字分マージンが
入るはずなのですが、どうしてもマージンが入りません。
IE6SP1、Opera7.23ではマージンが入りました。また、標準モード/互換モード両方でテストしてみましたが、違いはありませんでした。
ソースはかなり省略してますが、これ以外にこの3つの要素に設定しているプロパティは背景色、文字色、ボーダーのみです。
説明不足かもしれませんが、どなたか確認をお願いいたします。
>>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 などはどうでしょう?
>>948 ありがとうございました。考えていたのとまったく逆だったようです。
勉強不足をお詫びいたします。
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 を指定します。
検証ソースは次のレスに記載します。
953 :
952:04/03/04 22:02 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-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>
954 :
952:04/03/04 22:03 ID:???
</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>
以上。
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>
>>955 効かないのが正当。captionが無ければ効くのならそっちがバグ。
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>
>>956 そうだったんですか。
align属性があるんで勘違いしてました。
というかcaption要素があると効かなくなるのはalign属性でした。
お騒がせしてすみませんでした。
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>
960 :
952:04/03/05 10:36 ID:???
>>952 追加です。
div を absolute 指定した場合 (float 指定無し) も発生します。
回避方法は text-align が right 以外の場合のみ同じです。
text-align: right での回避は今の所不明です。
なお、
>>952 に書き忘れましたが OS は Win 系 です。
>>949 WinIE6
→1〜5 すべて問題なし。
(意外?)
Opera7
→1,4,5は問題なし。2,3はダメ。
(colgroup属性がcol属性の子を持ってる場合がダメ)
>>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幅で表示されて
しまいます。
つづく
つづき
問題はSafariで、なんと一列目と二列目が7em幅で三列目が
auto幅になってしまいます。実はこれ、
<colgroup style="width:30em"><col></colgroup>
<colgroup style="width:7em"><col><col></colgroup>
と書くと正しく表示してくれます。ここから、Safariは、
「colgroup要素があると、そこに指定されているスタイルを、
それ以後に出てくるcol要素に割り当てていく。その後、
各col要素に従って各列のスタイルを決める」
というアルゴリズムになっているのではないかと考えられます。
つまり、colgroup/col の親子関係を見ずに、出現順序だけ見て
いる感じ。
そのため、col要素を持たないcolgroup要素があると、スタイル
の適応される列がずれてしまうんだと思います。
さっさと埋めてHTML化させたほうがいいんじゃないのか?
じゃあ埋め。
復活!
970 :
Name_Not_Found:04/03/29 10:26 ID:KUtp7yco
特に問題なさそうだ
(゚д゚)ウマー
(゚Д゚)ハァ?
(゚Д゚)ハァ?
ごめん
(゚д゚)シメジ
(゚Д゚)ハァ?
キノコッノーコノコゲンキノコ
エリンーギマイタケ...