css - 三列布局...左(固定像素)、居中(50%)、右(50%)

Question

我希望左栏为 40 像素。我希望中心列占剩余视口(viewport)的 50%，我希望右侧列占剩余视口(viewport)的另外 50%。

它应该看起来像这样:

[LEFTCOLUMN][...CENTER COLUMN...][...RIGHT COLUMN....]
[...40px...][........50%........][........50%........]

这里介绍的解决方案 ( link ) 不适用于我的情况，因为中心列在移动设备上可能会变得过于折叠。

谢谢!

Answer 1

我认为这可能对你有用:

http://jsfiddle.net/KR9zj/

本质上，诀窍是 float LEFTCOLUMN，并将 CENTERCOLUMN 和 RIGHTCOLUMN 包装在一个带有 overflow: hidden 的包装器中。