2列右窄左宽、高度自适应且未知高度底部平齐+头部+导航+尾部——标准之路www.aa25.cn

下载此模板

　　此例是当左右侧高度都不固定时，实现底部平齐的方法。目前采用背景图片的方法是最简单和快捷的方法了。

　　制作一个和sidebar宽度相同、颜色相同的1px高背景图片，把它应用在mainContent上，然后向y轴方向重复，采用欺骗的方式来实现未知高度底部平齐，当然还有很多种其它的解决方法。细心的朋友可能已经发现，在mainContent样式表里有个 overflow:auto;zoom:1;的属性，overflow:auto;是让mainContent来自适应内部容器的高度，zoom:1;是为了兼容IE6而使用的CSS HACK。zoom:1;通不过W3C的验证，这也是遗憾的一点，幸好IE支持<!--[if IE]>这种写法，可以专门针对IE来写单独的样式，所以可以把这个属性写在页面内的<!--[if IE]>中，这样应该可以通过验证了。

　　总之，实现的方法是多种多样的，这只是本人在学习过程中总结的一点经验，权当抛砖引玉，希望能对您有所帮助，当然您有更好的办法和布局，欢迎一块来学习，交流，让web标准在中国得到更好的发展。同时希望您继续关注标准之路(www.aa25.cn)