久しぶりのIE7 バグ
最近はIE7は動作対象からはずすことが多くなったので、忘れていた（知らなかった？）バグに遭遇。備忘録として残します。
その１： floatした要素の中身が表示されたり、されなかったりする。
<dl> <dt>aaa</dt> <dd>横並びする</dd> <dt>bbb</dt> <dd>横並びする</dd> <dt>ccc</dt> <dd>横並びする</dd> </dl>
cssでdt,ddを横並びさせます。
dt{
float:left;
clear:left;
width:4em;
}
dd{
margin-left:4em;
margin-bottom:.5em;
}
こんな感じで設定してたのですが、IE7で見ると、２番目のdtの中の要素が
消えている！
いつものようにググってみたら、同じ症状ではないですが、参考になるサイトを見てやってみたら表示されました。
それは、消えた要素の親要素にwidth:100%を指定するということです。
height:1px;でもいいみたいです。
私の場合は、width:100%;を指定したら解決できました！
floatした際に背景が消える件(IE編)
http://blog.webcreativepark.net/2007/01/08-231453.html
その２：インライン要素の上下のボーダーが消える
どうも、高さが親要素の高さを超えているのが原因らしいです。
これも解決方法みつけました！
消えるインライン要素に
position:relative
を加える方法。
参考になりました。ありがとうございます！
インライン要素に指定したパディングやボーダーの上下が消えるhttp://pentan.info/stylesheet/bug/winie046.html
今さらながら勉強になります。。。。