purazumakoiの[はてなブログ]

技術メモから最近はライフログも増えてきてます。

IE6でのposition z-indexの挙動


via
CSS の z-index について整理してみる - かたつむりくんのWWW


普通は
positionで指定したものは後に出てくる要素ほど上に表示されるようになる。
その順番を自由に決めることができるのがz-indexプロパティだが

IE6の場合はこの順番が、同じ階層の要素で決まってしまう。


<div id="hoge">
  <div id="hoge-child"></div>
</div>
<div id="fuga">
</div>

↑の場合、fugaよりhoge-childを上に表示するためにはfugaと同列の要素であるhogeのz-indexをfugaより大きい値にしなければならない。



・・・ということでいいのだろうか。


2011-08-19追記:

via
IE7のz-indexバグに対応する - CSS,JavaScript | Bonkura Blog


この記事によると、

$(function() {
var zIndexNumber = 1000;
$('div').each(function() {
$(this).css('zIndex', zIndexNumber);
zIndexNumber -= 10;
});
});

とdivにz-indexを与えてあげれば大丈夫になるよう。
ulとか混ぜても大丈夫そうだけど原因は不明。