的确,那么我们来看看:
<style>
#layout{
margin:0px auto;
width:400px;
}
#left{
background-color:#cccccc;
border:2px solid #333333;
width:200px;
height:300px;
float:left;
}
#right{
background-color:#cccccc;
border:2px solid #333333;
width:200px;
height:300px;
float:left;
}
</style>
</head>
<body>
<div >右列</div>
</div>
这样能实现吗?不能,显示叶面中第二个div被挤到下面去了。因为浏览器的盒模型。一个元素的实际占用宽度大小是由padding+margin+width+border来决定的。所以当中间2个div要计算其宽度的时候,应该把分别border的量值计算进来,也就是说应该把#layout地width 改为412px,ok,现在再察看一下吧。