>>4
問題は把握しました。
ただ、相変わらず理想形が把握できません。
ここでいう理想形とは、問題に関わらずあなたが実現したいレイアウト等のことです。
理想形さえ分かればCSSを抜本的に改編することで改善(実現)するという手もあります。
問題を解消することで実現するのも手ですが…。
>>4-5
ということで検証してみたのですが、<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>タイトル</title>
<style type="text/css">
* {
margin:0;
padding:0
}
#second{
float:left;
width:99%;
background-color:#ccf;
}
#first,
#third {
clear:both;
padding-top:30px;
border:2px solid #fcc;
background-color:#cfc;
}
</style>
</head>
<body>
<div id="first">first</div>
<div id="second">second</div>
<div id="third">third</div>
</body>
</html>計算結果が100%未満となる幅を持つボックスのフロート(直下ではなく)直後のボックスで clear を行い、
そのボックスの padding-top が正の値のときに、そのボックスに背景(background, background-color)が指定されていると発生するバグのようです。
DTDは特に関係ないようです。
WinIE6.0で確認しました。
これについては私は扱ったことがないので更に検証してみたのですが、具体的な解消法は今のところ分かりませんでした。
この症状について検索して調べていないので、もしかしたら簡単に詳細な条件と解消法見つかるかもしれませんが…。