列举一些标准布局常见问题及解决方法。

3像素问题及解决方法

　　当使用 float 浮动容器后，在 IE6 下会产生 3px 的空隙，有意思的是右侧容器没设置高度时 3px 在右侧容器内部，当设定高度后又跑到容器的左侧了，所以对布局精度要求高的话，请参考例29、31的解决方法上边容器浮动后，下边的容器跟着浮动，造成页面错乱。
　　如以上例子中的 footer 必须要单独占一行，但当 sidebar 浮动后，content 的高度小于 sidebar 的高度时，footer 也跟着浮动到 sidebar 右侧了，造成页面错乱。解决办法是在 maincontent  和 footer 之间插入一个容器，设置样式 clear:both;  height:0;  font-size: 1px;  line-height: 0px; ，用 clear:both; 清除，即可使页面正常。

当子元素浮动且未知高度时，使父容器适应子元素的高度

　　这种情况可在父窗口加上 overflow:auto; zoom:1; 这两个样式属性，overflow:auto; 是让父容器来自适应内部容器的高度，zoom:1; 是为了兼容IE6而使用的 CSS HACK 。zoom:1; 通不过 W3C 的验证，这也是遗憾的一点，幸好 IE 支持 <!--[if IE]> 这种写法，可以专门针对IE来写单独的样式，所以可以把这个属性写在页面内的 <!--[if IE]> 中，这样应该可以通过验证了。

相对定位与绝对定位

　　规划页面时，许多时候需要用到相对定位或绝对定位，这里边有个技巧，掌握后有些地方就不用繁冗的 js 了。就是当父容器使用相对定位后，此时子元素再使用绝对定位，位置是相对于父元素。如果父元素没有定位，那么子元素的绝对定位是相对于浏览器。

IE6 双倍边距 bug

　　当页面内有多个连续浮动时，如本页的图标列表是采用左浮动，此时设置 li 的左侧 margin 值时，在最左侧呈现双倍情况。如外边距设置为 10px，而左侧则呈现出 20px，解决它的方法是在浮动元素上加上 display:inline; 的样式，这样就可避免双倍边距 bug。