与Internet Explorer图像浮问题<8

Question

我注意到与 “浮动” 的CSS属性和Internet Explorer一个非常恼人的问题6 & 7.

我有2个简单图像的HTML：

<img src="aa.jpg"> 
<img src="bb.jpg" class="alignright"> 

这里是（非常简单）CSS：

.alignright { float: right;} 

随着浏览器中的第一图像（没有任何浮动属性）： http://img5.imageshack.us/img5/2505/schermata4t.png

有什么办法解决这个问题与CSS？你想

Answer 1

广场的东西浮在容器的右侧第一（公式中“bb.jpg”图像“aa.jpg”之前）

Answer 2

我认为这更多的事情要做的事实，尽管如此，你还没有将你的第一张图像浮起来。

查看详情http://jsfiddle.net/biznuge/KUnNn/3/。

这对我来说似乎也发生在FF中，而不是像你所建议的那样只是< IE8，所以它似乎预计beahviour我猜。

Answer 3

对于IE7/IE6你必须......

• 浮动第一图像左右
• 浮动第二图像右（或左也）
• 添加“明确：既”以下文本块（如果你想让它在图像后出现）

http://jsfiddle.net/Kyq5u/

我用跨度s来模拟图像。

CSS ...

.img-a { 
    background-color: red; 
    padding: 100px; 
    float: left; 
} 
.img-b { 
    background-color: blue; 
    padding: 100px; 
    float: right; 
} 
p { 
    clear: both; 
} 

HTML ...

<span class="img-a"></span> 
<span class="img-b"></span> 

<p> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu dolor et arcu dapibus cursus. 
</p>