Question

<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。我如何将它们分开？

Answer 1

您需要在＃content2 div

上使用clear:both;

如果您真的想学习浮游物的所有内容，请查看这个惊人的教程：http://css.maxdesign.com.au/floatutorial/

Answer 2

在您的内容＃2上使用clear:both;

Answer 3

应用：

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

Answer 4

您忘了关闭<div id="images1">：）

Answer 5

在content2 div上使用'clear：both'

Answer 6

我希望您需要在<div id="content2">Text 2</div>之前添加另一个div <div style="clear:both;"></div>

Answer 7

清除你的花车。这篇文章描述了最新进展：Clearing A Float Element

Answer 8

您尚未关闭<div id="images1">。如果这个div被关闭并且Content divs没有浮动，那么它应该可以工作。

Answer 9

你的content1 div上的

overflow:hidden将扩展到包括所有浮动的孩子。（当然，这将隐藏非浮动的溢出内容。）

如何让HTML div进入另一个div？

9 个答案: