2011-06-07 86 views
14
<html> 
<body> 
<div id="content1"> 
    <div id="text1">This text floats left</div> 
    <div id="images1"><img src="img.jpg" /></div> <!--Floats right--> 
</div> 
<div id="content2">Text 2</div> 
</body> 
</html> 

當我試圖做到這一點,並嘗試做一個像兩個行的表格一樣的文本左浮動和圖像浮動在最上面的一排,所有出現的是content2-div是壓入content1-div。我怎樣才能讓他們分開?如何讓HTML div在另一個div下運行?

+1

隨你挑,夥伴 – 2011-06-07 16:04:11

回答

2

使用clear:both;您的內容#2

0

你忘了關閉<div id="images1"> :)

0

使用「明確:雙方」在內容2格

0

我希望你需要在<div id="content2">Text 2</div>之前添加另一個div,這將是<div style="clear:both;"></div>

1

應用:

#images1{ 
float:right; 
} 

#content2{ 
clear:both; 
} 

和修復你的HTML標記

<div id="images1"><img src="img.jpg" /> <!--Floats right--> 

關閉DIV:

<div id="images1"><img src="img.jpg" /> <!--Floats right--></div> 
0

你有沒有關閉<div id="images1">。如果這個div被關閉,Content div不會浮動,那麼它應該工作。

0

overflow:hidden你的content1 div會使它擴大到包含所有漂浮的孩子。 (當然,這會隱藏非浮動溢出內容。)