位置指定された要素をフロートにした場合、その子要素を絶対配置にしても親要素を無視し、初期コンテナブロックを基準にした配置になる。
<style type="text/css">
div#parent {
float: left;
position: relative;
width: 100px;
height: 100px;
background:aqua;
}
div#child {
position: absolute;
left:30px;
top:20px;
width:50px;
height:50px;
background:teal;
}
</style>
<div id="parent">親
<div id="child">子</div>
</div>
親要素(背景が空色)はフロート、子要素(背景が青緑色)は絶対配置です。
症状欄、例示欄の一部などを略した状態です。
WinIE6.0での表示
N6.1での表示
N6.2.3、Moz1.0では標準・互換モードともに同様の状態になります。