div背景自动延伸的解决

最近帮客户进行div重构的时候，遇到一个问题。该网站背景底色是橙色，中间区域是白色，也就是外面留出一截橙色的边边。这类网站布局可以有多种方式。我选择body的background是橙色，中间main层是白色底，这时需要考虑main层的背景自动延伸问题，在opera或者firefox如果你不定义高度的话，你会发现背景不会向下延伸，但是定义高度是极不方便的举措。还好阿捷帮我们解决了这个问题，http://www.w3cn.org/article/layout/2004/88.html，在main里面再加一个bg的层，css定义如下：

.main,.bg{
margin:0 auto;
width:980px;
background:#FFF;
}
.bg{float:left}

窍门在于bg这个层定义float: left;，因为float使层自动有宽和高的属性。(阿捷这么理解：)我也不知道怎么理解，反正这样做可以出来效果^_^
虽然bg是float:left，但由于main是margin:0 auto; 而且bg又包含在main里面，所以还是居中的。这样就解决了背景的延伸问题。