第一：設置父div的屬性：overflow:hidden;zoom:1;
#parent{border:1px solid red;overflow:hidden;zoom:1;}
#children,#div3{float:right;border:1px solid blue;} 第二：父元素也是設置浮動效果
#parent{border:1px solid red;float:left;}
#children,#div3{float:right;border:1px solid blue;} 第三：在添加一個子元素，並設置clear樣式：
<div id="div1">
<div id="div2">two</div>
<div id="div3">one</div>
<div style="clear:both"></div>
</div> 使用第一種方法的實例
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/json2.js"></script>
<style type="text/css">
.mydiv{
float:left;
width:130px;
height:160px;
background:red;
margin-left:40px;
margin-top:15px;
margin-bottom:15px;
}
.myspan{
margin-left:20px;
}
</style>
</head>
<body>
<div style="width:90%;margin:0px auto;">
<div>匹配情況</div>
<div style="margin-top:5px;">
<span style="margin-left:15px;">巡維中心:</span>
<span style="margin-left:5px;">
<span class="myspan" style="margin-left:0px;">深圳</span>
<span class="myspan">龍華</span>
<span class="myspan">深圳</span>
<span class="myspan">龍華</span>
<span class="myspan">深圳</span>
<span class="myspan">龍華</span>
</span>
<span style="float:right">切換按鈕</span>
</div>
<div style="border:1px solid black;overflow:hidden;zoom:1;margin:0 auto;">
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv"></div><div class="mydiv"></div><div class="mydiv"></div>
<div class="mydiv" style="clear:both">56565</div>
</div>
</div>
</body>
</html>