topics
一言メモ
selectタグをJavascriptで生成したとき、IE6だけsize属性が1になっちゃう。そりゃないぜ!止む無くsetTimeoutで切り抜けた【一言集】

ホーム > マークアップ > CSS > line-heightとimgによるWinIEバグ

line-heightとimgによるWinIEバグ

line-heightを指定してる中にimgが含まれると、WinIE(IE7では修正されている)では行間が狭くなる。

<ul>
<li>テキストテキスト</li>
<li>テキストテキスト<img /></li>
<li>テキストテキスト</li>
</ul>

こうした状況に対応させるため、li要素、またはimg要素にIE6以下で適用されるハックを利用させる。

サンプル1
li{
_margin-top:任意の値
_margin-bottom:任意の値
}
サンプル2
img{
_margin-top:任意の値
_margin-bottom:任意の値
}

インライン要素にpaddingを設定してしまうと、IE5など一部で適用されない。そこで、marginを設定したほうがよい。

また、このハックはCSSの仕様に準拠していないので、Validにこだわるならおすすめしない。

この記事に関するご意見・ご感想をお待ちしております。

お名前:



ナビゲーション