- Ruby / Rails以外の開発一般
READ MORE
IE7で、JavaScriptを使って動的に要素を表示・非表示した場合、要素が重なってしまうことがあります。
background
指定を外すと、再現しません。<div>
開きと22行目の<div>
開きの間に「スペース・TAB・改行以外の何か(コメントでも可)」を入れると、再現しません。
22行目のheight:2em
は、hasLayout
がtrue
になれば何でもOKです。
まとめると、
hasLayout=false
である。position:relative
であり、なおかつhasLayout=true
である。これらの条件を満たす場合、「Aの前にある要素の高さが変わり、AのY座標が変更になっても、BのY座標は再計算されない」というIE7独自のバグと言えそうです。
DebugToolbar等で位置の再計算を行うと、正しい位置に移動します。
おそらく計算順序にバグがあるのだと思います。position:relative
を使うときは気をつけましょう。