overflow：hidden和clear：both

overflow 属性规定当内容溢出元素框时发生的事情。所有主流浏览器都支持。

 

 <div class="a">
	<div class="a-left">我是A浮动在左边</div>
	<div class="a-right">我是B浮动在右边</div>
 </div>

 

 

 <style type="text/css">
	div.a{border:1px solid blue;width:500px;height:30px;overflow:hidden;}
	div.a-left{width:200px;float:left;height:30px;margin-top:6px;}
	div.a-right{width:400px;float:right;height:30px;margin-top:6px;}
 </style>

 父div设置了overflow：hidden，此时子div的宽度超出父div，则浮动在右的子div被隐藏掉，而不是将父div水平撑开。超出的部分就会被隐藏----隐藏溢出的含义。效果：

如果不对父元素进行设置即默认情况则会出现如下效果：

 

 

clear 属性规定元素的哪一侧不允许其他浮动元素。

 

 

<style type="text/css">
div#left-div {float:left;width:40%}
div#right-div {float:right;width:60%}
div#bottom-div {clear:both;width:100%}
</style>
<div id="right-div">i'm right!</div>
<div id="left-div">i'm left!</div>
<div id="bottom-div">i'm bottom!</div>

    

 

 

 

 

http://www.chinaz.com/design/2008/0818/35473.shtml

http://www.w3cschool.cn/pr_pos_overflow.html