※ ChatGPTを利用し、要約された質問です（原文：２段組レイアウト時に意図しない空白が生じる）
IE6.0とFirefoxで２段組レイアウト時に問題が発生
このQ&Aのポイント
IE6.0とFirefoxでの２段組レイアウト時に、右段の文字が微妙にインデントされる問題が発生しています。
IEの結果では、左段に文字がある場合に右段の文字がインデントされてしまいますが、Firefoxでは望む動作となります。
原因を特定できずに困っているため、アドバイスをお願いします。
IE6.0 と firefox での動作が異なって困っています。
HTMLおよびスタイルシートは以下の通りです。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
div.area_body {
width: 80%;
margin: 0 auto;
background-color: yellow;
}
div.area_navi {
float: left;
width: 100px;
background-color: red;
}
div.area_content {
margin-left: 100px;
background-color: blue;
}
div.block1 {
background: green;
}
div.block2 {
background: blue;
}
-->
</style>
</head>
<body>
<div class="area_body">
<div class="area_navi">
aaa<br>
aaa
</div>
<div class="area_content">
<div class="block1">
a <br />
<div class="block2">
b <br />
c <br />
</div>
d
</div>
</div>
</div>
</body>
</html>
IE 6.0 (win) における右段の文字
a
b
c
d
firefox (win) における右段の文字
a
b
c
d
となり、IEは左段に文字がある場合に右段の文字が微妙にインデントされてしまいます。
firefoxの結果が自分が望む動作なのですが、原因は何でしょうか？
アドバイスをお願いします。
お礼
まさにこちらのバグと同じ現象です。 参考URLの対策法だとたしかに見かけ上のインデントはなくなったものの、その分divブロック自体がずれてしまうという現象が起こってしまったので、floatは諦めて position:absolute; による段組で解決いたしました。 ありがとうございます。 しかしこんなにバグがあるとは…。