固定＋自动伸缩——CSS布局技巧

海青百科论坛的首页，右侧边栏部分宽度是固定的，而左侧中间版块显示部分的长度是伸缩的。这样使页面在不同分辨率下显示效果非常好。我试着研究了下。。

开始试着写了几个，都不成功。用FF的站长工具插件，发现它整个页面布局不是用的表格，而是DIV。。这就奇怪了，如果设置版块显示部分的width:100%,那它的值是相对它的父盒子来说的，也就是BODY，而我需要让它减去右侧的边栏。

右侧边栏部分肯定是浮动的，而且是向右浮动。但是左侧要怎么写呢？用Javascript肯定能够实现，但是这样未免有点麻烦。我相信CSS应该可以实现的。

最后没办法，我GOOGLE了下。。终于找到了办法,这里简单写下：

<divstyle="position:relative; float:right; width:200px;">right column</div><divstyle="margin-right:210px">main box</div>

问题的关键是：把right column和main box 的顺序颠倒！一般写代码，我的习惯是从上到下、从左往右。但是将这两个DIV如果倒过来写就不会实现两个DIV在一行上显示的效果了。