IE6

IE6 CSS Fixer

ie6fixer – onderhond.com
普通のcssからIE6用のcssを吐き出してくれるサービス、現在バージョン0.95。

例えば

IE6だと左右のmarginが40pxになってしまう以下の記述
[css classname=”css-sh”]
#test{
margin:20px;
float:left;
}
[/css]

これをie6 css fixerで変換させると
(select your master stylesheetのpaste your complete master stylesheetを選択してgive me my ie6 fixesをクリック)
[css classname=”css-sh”]/* add display:inline to floated elements */
#test {display:inline;}[/css]
なんてcssを吐き出してくれる。

これを保存してコンディショナルコメントでie6だけ読み込むようにすれば対策完了。

でもって、最初からdisplay:inline;が付けてる場合は、新たにdisplay:inline;を吐き出さないのかな?と試してみたけどdisplay:inline;を吐き出してた。

というか、[css classname=”css-sh”]
#test{
float:left;
}
[/css]
を変換すると
[css classname=”css-sh”]/* add display:inline to floated elements */
#test {display:inline;}[/css]を吐き出してた。
むむむ?

dtとddを横並びさせた時、IE6でddが3pxズレる時はzoom:1;

タイトルが全てだけど

dtとddを横並びさせた時、IE6でddが3pxズレる時はzoom:1;を付けるとズレなくなりました。
[html classname=”html-sh”]<dl>
<dt>乱雑</dt>
<dd>モックアップ</dd>
</dl>
[/html]
[css classname=”css-sh”]dt {
width:3em;
float:left;
}
dd {
margin-left:3em;
_zoom:1;
}[/css]

zoomの前の_はIE6用のハック
/にするとIE7以下に効く。