css|問題 這個問題普遍的困擾著新手朋友，不知道如何是好，想不出辦法進行解決。
其實這就是傳說中的“IE 3px bug”。解決的辦法也比較簡單。請看下面的樣本說明。
IE中兩個層之間的間隙（IE 3px bug）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>YourHomePage.com.cn</title>
<style type="text/css">
<!--
#left {
float:left;
width:200px;
height:100px;
background:#f00;
}
#right {
width:200px;
height:100px;
background:#fc0;
}
-->
</style>
</head>
<body>
<div id="left">YourHomePage.com.cn</div>
<div id="right">YourHomePage.com.cn</div>
</body>
</html>
解決3px bug的方法之浮動法float
此例中，我們給右邊的層，應用float:left;浮動，即可解決IE 3px bug。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>YourHomePage.com.cn</title>
<style type="text/css">
<!--
#left {
float:left;
width:200px;
height:100px;
background:#f00;
}
#right {
float:left;
width:200px;
height:100px;
background:#fc0;
}
-->
</style>
</head>
<body>
<div id="left">YourHomePage.com.cn</div>
<div id="right">YourHomePage.com.cn</div>
</body>
</html>
解決3px bug的方法之障眼法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>YourHomePage.com.cn</title>
<style type="text/css">
<!--
#left {
float:left;
width:200px;
height:100px;
margin-right:-3px;
background:#f00;
}
#right {
width:200px;
height:100px;
background:#fc0;
}
-->
</style>
</head>
<body>
<div id="left">YourHomePage.com.cn</div>
<div id="right">YourHomePage.com.cn</div>
</body>
</html>
