與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>