0

在一个容器中有三个 div,我想漂浮在一个大 div 上。我该怎么做呢?到目前为止我有这个...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><head>
<style type="text/css">
<!--

div.HeaderContainer { float:left; }
div.One {  float:left; border: 1px solid; }
div.Two {  float:left;} 
div.Three {  float:left; border: 1px solid; } 
div.Content{ float:none; }

-->
</style>
</head>
<body>

<div class = "HeaderContainer">
    <div class="One">one</div>
    <div class="Two" id="tdAmplicon">two</div>
    <div class="Three">three</div>
</div>
<div class="Content" >content</div>

</body>
</html>

但是,这只会将内容 div 放在 HeaderContainer div 的左侧。如何使内容 div 浮动在 HeaderContainer div 下方?谢谢。

4

2 回答 2

1
div.Content { clear: both; }

将内容 div 放在下面HeaderContainer

http://jsfiddle.net/ZDE6C/

于 2012-04-05T18:01:46.783 回答
0

或者,您可以将float:left;on替换div.HeaderContaineroverflow:hidden;

div.HeaderContainer { overflow: hidden; }

http://jsfiddle.net/ZDE6C/1/

于 2012-04-05T18:11:20.647 回答