对于无法正确解决这个问题感到有点沮丧.我正在更新一个旧网站,并试图在没有表格的情况下完成这项工作.我可以使用box flex来实现它,但它不受很多浏览器的支持.布局是这样的
[col-1-as-small-as-possible] [col-2-should-use-all-space] [col-3-as-small-as-possible]
列不需要具有相同的高度,并且所有3列的总宽度由父级约束.
如果我使用浮动,我无法让中间列扩展.col-1和col-2的宽度不是固定宽度.
任何解决方案都不会比问题(表格)更糟糕?
这是基于表格的解决方案的一个示例:http://jsfiddle.net/7dsCV/1/
这是一个奇怪的解决方案,但设置overflow: hidden在中间div会给你我相信你想要的:
我一直想弄清楚为什么会发生这种情况,但还没有抽出时间。我最好的猜测是,这只overflow适用于矩形容器,并且漂浮物包裹在其中,div使其本质上不是矩形。