参见英文答案 > 2 column div layout: right column with fixed width,left fluid 8个
标题说明了.我想要一个2列CSS布局：
>居中 – 主要内容以页面为中心
>具有固定(像素)右列宽度
>左侧有流体 – 用尽所有可用空间减去右列宽度
>是源排序 – 左列内容位于HTML源中的右列内容之前
>允许最小宽度 – 在我的示例中为760px
>允许最大宽度 – 在我的示例中为1024px
如果窗口大于最大宽度,则内容将以页面的最大值为中心.如果窗口小于最大宽度,则内容将填充页面的100％,除非它小于最小宽度,这将使水平滚动条出现.
我愿意使用一些小的javascript来处理不支持这些属性的浏览器的最小/最大宽度(我正在看你IE6),但我只是愿意让这部分布局降级.
用桌子来简单下降.我已经看了几百个示例布局,没有什么可以做我要问的所有事情,尽管有几个接近.问题似乎是以相同的方式获得流畅的左列和源排序.我已经找到了几个固定的左/右流体(与我想要的相反)的例子,其具有适当的源顺序,或流体左/右固定而没有源顺序,但不是两者.
我不在乎它是否使用浮点数或负边距,但我想避免绝对定位.
+---------------------------------------+
| |
| +---------------------------+-----+ |
| |fluid |fixed| |
| | | | |
| | | | |
| +---------------------------+-----+ |
| |
+---------------------------------------+
最佳答案
我强烈建议您查看CSS templates at Dynamic Drive.第五个应该是您正在寻找的(流体固定).只需在主容器元素中添加最大宽度和最小宽度,就可以全部设置.
仅供参考,这些是非常好的模板,可用作页面布局的基础.使用CSS是了解浮游物和定位的好方法,它在我早期的Web开发中确实帮助了我.
