爲什麼divs的行爲如此？

我得到這個問題有時候我的div不像預期的那樣。我想要的是他們'流'的佈局，因爲我明白他們應該但他們不是我只是想知道爲什麼不。我用firebug來檢查CSS，似乎沒有任何超出規範的東西，他們正在拾取，但它們不會一個接一個地流動。爲什麼divs的行爲如此？

我在測試網站提供了兩套代碼之一，該網站正在渲染正確，然後出現問題頁面。

代碼的div：

<div style="border:solid 1px #c9c9c9; width:100px; height:100px; float:left;"> 
    sss 
</div> 
<div style="border:solid 1px #c9c9c9; width:100px; height:100px; left:20px; position:realtive;"> 
    2 
</div>

產品圖Div的流動：

http://i45.tinypic.com/t5k8x1.jpg

PIC單片機的div不流淌

http://i47.tinypic.com/2ewfpz9.jpg

有人知道如何讓他們到表現如預期？它的值得指出的是，如果我把一個浮動：留在第二個div這種排序的問題，但這意味着下一個div不會下降到下一行正確....

希望有人可以幫助，非常感謝

來源

2010-01-05 Exitos

您的圖像顯示不正確，請考慮編輯您的帖子以解決問題。 – 2010-01-05 10:17:35

請將代碼剪切並粘貼到您的問題中，以方便人們查看。這兩個代碼片段看起來與我相同的是正確的？如果是這樣，兩個效果圖之間還有什麼不同？ – Paolo 2010-01-05 10:20:21

我懷疑他的差別在於他沒有向我們展示！ – Benjol 2010-01-05 10:26:09

float只能「剪切」文本，不能包裝盒。而且你的圖片都不是這些CSS屬性的正確渲染。正確的渲染應該是兩個框在同一個地方（重疊），'sss'在邊框內，'2'在底部邊框下。

在兩個div上使用float:left;應該照顧它。

<div style="float:left;">sss</div> 
<div style="float:left;">2</div> 
<div style="clear:both;">the next div</div>

如果東西是跨瀏覽器出毛病了，請確保您使用的具有普遍默認的CSS，如XHTML 1.1的doctype。否則，你可能想爲所有元素生成一個默認樣式表。

來源

2010-01-05 10:32:45

Imho嘗試添加float兩個div，之後，第三個div應該是clear:both。

來源

2010-01-05 10:23:46 IProblemFactory

您可以留下兩個div的浮動，並在該元素或CSS第三DIV使其「明確：既」 ......

尼斯圖像的方式：d如何赫克你讓時間反正不清楚。

來源

2010-01-05 10:26:02 Younes

即時通訊困惑我沒有看到我的圖像有任何問題爲什麼他們完全不清楚？ – Exitos 2010-02-05 09:36:37

此刻我看不到他們了:)。 – Younes 2010-02-05 10:47:54

爲什麼divs的行爲如此？

回答

相關問題