Mikel
想得到的正确布局图：
结果在FireFox和IE中得到的结果却是：
造成这种情况的CSS代码是：
<style type="text/css">
<!--left-->
.left{
width:500px;
height:600px;
float:left;
border:0;
}
.sample{
width:500px;
height:200px;
float:left;
background-color:#666666;
}
.news{
width:500px;
height:200px;
float:left;
background-color:#006600;
}
<!--right-->
.right{
width:200px;
height:600px;
float:right;
}
.seachIt{
width:200px;
height:100px;
float:right;
background-color:#0066CC;
}
</style>
<body>
<div id="body" class="main">
<!--content-->
<div id="content" class="content">
<!--left content-->
<div id="left" class="left">
<div id="sample" class="sample">sample</div>
<div id="news" class="news">news</div>
</div>
<!--right menu-->
<div id="right" class="right">
<div id="seachIt" class="seachIt">seach</div>
</div>
</div>
</div>
</body>
</html>
分析错误原因，SeachIt的margin没有进行设置top属性，结果浏览器默认margin-top为sample的height
200px,结果造成一直错位，因此需要设置seachIt的margin-top:-200px，这样减少了margin的高度，修改后的代码如下：
<style type="text/css">
<!--left-->
.left{
width:500px;
height:600px;
float:left;
border:0;
}
.sample{
width:500px;
height:200px;
float:left;
background-color:#666666;
}
.news{
width:500px;
height:200px;
float:left;
background-color:#006600;
}
<!--right-->
.right{
width:200px;
height:600px;
float:right;
}
.seachIt{
width:200px;
height:100px;
float:right;
margin-top:-200px;
background-color:#0066CC;
}
</style>
