相対配置を行う場合の位置指定プロパティ(left, right, top, bottom)に負の値を指定すると無視されてしまう。
- Category: Internet Explorer, Mac
- Tag: position, relative, 負数
例示
<style type="text/css">
<!--
div#a {
border-left: 3px solid red;
}
div#b {
border-width: 3px 3px 3px 0;
border-style: solid;
border-color: blue;
background: aqua;
width: 100px;
float: left;
position: relative;
left: -3px;
}
div#c {
margin-left: 120px;
}
-->
</style>
<div id="a">
<div id="b">B</div>
<div id="c">C<br />C</div>
</div>
B
C
C
C
id属性にbが指定されたdiv要素は、id属性にaが指定されたdiv要素の左ボーダーを隠すように、相対配置で左へ3px移動させています。
スクリーンショット
WinIE6.0での表示(標準モード)
補足
マージンに負の値を指定することでこのバグを回避できます。ただし、WinIEでは指定値以上のマージンがとられてしまうようです。
<style type="text/css">
<!--
div#d {
border-width: 3px 3px 3px 0;
border-style: solid;
border-color: blue;
background: aqua;
width: 100px;
float: left;
margin-left: -3px;
}
-->
</style>
<div id="a">
<div id="d">D</div>
<div id="c">C<br />C</div>
</div>
D
C
C
C
※id=a, id=c のdiv要素のスタイルは前出の例での指定と同じです。
修正状況
MacIE5で不具合の発生が確認されたようです。


