到了这步，你会发现这3列的盒模型为32767px，此时你要在父元素上加：overflow: hidden;当然IE6.0是：zoom:1;
#container {
background-image: url(‘bg.gif’);
width: 960px;
margin: 0 auto;
overflow: hidden;
}
Step4:
现在#main的视觉效果是在最左栏，我们要想办法把它搞成中间
思路：先把#main排到中间，我们可以#main{margin-left:300},这时，#left被挤到800px的位置，在#left{margin-left:-800px;}就能搞定，可惜啊，IE6这个贱货，实在是无语，只得重新思考了。
一般的，在css做布局时，有几种思路，一种是float,一种是定位，关于定位的话，不熟悉的google一下就行，提一下：position: relative;的这个属性，如果不指明top,left的话，它的视觉效果不会改变。
所以，为了让#main在视觉效果上有所突破，那么必须指明top或者left，在这里只需要指明left就行了,
#main {
float: left;
background-color: #e5e5e5;
width: 500px;
left: 300px;
}
#left {
float: left;
background-color: #7bd;
width: 300px;
left: -500px;
}
其实在这中间，还有一个概念是比较重要的，#main，#left有了position:relative以后，就有了层的概念，所以当#main{left:300px}后，#left已经独立出来了，不会被挤到800px的位置了，故：之需要left:-500px就能达到左边，500是#main的宽。
最后考虑的是向下兼容，
提供一段代码：
虽然写了这么多，但是你能够做，并不代表你应该这么做，这是一个战术和战略的问题，以下是我个人想知道的：
我觉得一开始：
padding-bottom: 32767px;
margin-bottom: -32767px;
这么大的值，在reflow阶段会不会很耗资源，而采用js来控制他们的高度，会不会来得更轻松一些呢？
第一次写这种东东，感到很棘手，不管是构思上还是在语言表达上都还是很晦涩的，希望大家积极的指正，希望能和更多的朋友来进行交流，一方面是提高自己，另一方面是促进社区的和谐和共享，尽一份自己微薄的力量。
