位置div在兩個浮動div後面

我有兩個div，一個用float：left，另一個用float：right。它們並排顯示，但是當我添加第三個div時，它將顯示在兩個浮動div上，而不是像我想要的那樣顯示在後面。位置div在兩個浮動div後面

<div id="left_side" style="float:left;" ></div> 
<div id="right_side" style="float:right;" ></div> 
<div id="below_side" ></div>

我想要做什麼：http://dl.dropbox.com/u/20836988/intended.png

我居然得到：http://dl.dropbox.com/u/20836988/what%20i%20get.png

我試着加入垂直對齊：底部到最後一個div沒有結果。另外我試過添加一個包含兩個浮動div的div，然後是第三個div，但我總是得到相同的結果。我確信它一定是一個非常基本的問題，但我無法在任何地方找到答案...

來源

2012-10-04 Rocafort8

below_side需要一個浮動和明確：兩者;

當前左側和右側浮動 - 將它們從文檔流中取出。這意味着下面的一面會出現在錯誤的地方。

如果你把float：留在下面，它也會將它從docment流中取出並放在與左和右相同的空間中（相對），然後你添加clear：兩者都是這樣它出現在左下和右側

來源

2012-10-04 01:50:56 kristopher

將clear: both添加到您的below_side div。

看到這個link。

來源

2012-10-04 01:48:17 SenorAmor

<div id="left_side" style="float:left; background-color:#ccc" >gdfgfdg</div> 
<div id="right_side" style="float:right;background-color:red" >gfdgfkjkjhkjhkjh</div> 
<div id="below_side" style="background-color:#000; z-index:1000; float:left; color:#FFF;" >dsfdfds</div>

來源

2012-10-04 10:31:57

位置div在兩個浮動div後面

回答

相關問題