在使用2栏的模板时，有时候会碰到这样一种情形：

一般的布局是这样的：

外面的父层，包含一左一右两个子层，左层设置float：left，右层设置float：right；

假设：父层为p，左层为l，右层为r，p的width:850px,l的width:600px,r的width:200px

只要两个子层的宽度加起来，小于父层的宽度，就可以正常显示了，即600+200<850。

但是，经常碰到，层会设置magin属性，那么，两个子层的宽度还要加上magin的值，小于父层的宽度，才能正常显示。

如果left设置了margin-right：30px ，右层设置了margin-left：30px，那么就要加上60px

那么在显示了l后，剩下的可供显示的宽度为：850-600-30=220px，r的margin=30，所以，r可用的宽度为190，不够r完整显示

这种情况下，r层就会下移到l层的下方，出现开头的情形。

——————–

ps:补上刚刚碰到的一种情形

侧栏没有嵌套到父层里面去

即

<div id=”content”>
    <div id=”contentleft”>
     </div>
</div>

<div id=’sidebar’></div>

其实应该是

<div id=”content”>
    <div id=”contentleft”>
     </div>
<div id=’sidebar’></div>
</div>

咳，可惜让我找了那么久，才发现这个问题～～

汗～～