question:1103859487

question:1103859487
CSSのIE6とflaotとwidth:100%;について質問です。以下略
基本的にwidth:100%;内にwidth:50%×2を並べるのはIE6でそういう風になるので困るということだったかな。本来は問題ないのだけれども、長い英数文字列が来た時に困るので止めた方が良いかな、と。バグやん。
で、サンプル。
html

<div class="Content">
<div class="AB">
<div class="A">
左側フロートです。左側フロートです。左側フロートです。左側フロートです。左側フロートです。
</div>
<div class="B">
右側フロートです。右側フロートです。右側フロートです。右側フロートです。右側フロートです。
</div>
ここもdiv.AB
</div>
ここはdiv.Content
</div>

<div class="Content2">
<div class="AB">
<div class="A">
左側フロートです。左側フロートです。左側フロートです。左側フロートです。左側フロートです。
</div>
<div class="B">
右側フロートです。右側フロートです。右側フロートです。右側フロートです。右側フロートです。
</div>
ここもdiv.AB
</div>
ここはdiv.Content2
</div>

CSS

body {margin: 20px;}
div {margin: 0px; padding: 0px;}

.A {background-color: aqua;}
.B {background-color: lime;}

.Content {width: 66%; float: left;}
.AB {width: 100%;}
.Content .A {width: 50%; float: left;}
.Content .B {width: 50%; float: right;}

.Content2 {width: 66%; float: left;}
.AB {width: 100%;}
.Content2 .A {width: 50%;}
.Content2 .B {width: 50%;}

.Content2 .AB {position: relative; top: 0px; left: 0px;}
.Content2 .A {}
.Content2 .B {position: absolute; top: 0px; right: 0px;}

floatでいかに回避できるかと考えたが、position使った方が楽。一応はリキッドデザインになっている。
サンプルも作ったのだけれど、さてどうしたものか。質問者がfloatを使いたさげなので、一旦休止。もう少し様子を見る。