html - 如何使用动态左中右 DIV 填充父级？

Question

编辑:

根据下面 Mat 的建议，我摆弄了 jsFiddle 并提出了“真正的”问题。

将内容绝对定位在中心 DIV 内不会产生所需的结果:

http://jsfiddle.net/yxFQK/22/

为了绝对定位 child ， parent 需要是相对的，对吧？但这弄乱了漂亮的左/中/右布局:

http://jsfiddle.net/yxFQK/23/

有什么想法吗？提前谢谢你。

---

原帖:

我们想要一个固定宽度的父 DIV 和三个动态宽度的子 DIV:

左右 DIV 的大小应根据内容而定。中心 DIV 应填充左右 DIV 之间的空间:

[[Left][        Center        ][Right]]

(或)

[[Big Left][    Center    ][Big Right]]

中心 DIV 应该滚动溢出内容(所以我们不能使用 overflow: hidden)。

此外，我们想更改父 DIV 大小(使用 CSS 媒体查询)，并让所有内容继续很好地填充:

[[Left][    Center    ][Right]]

[[Big Left][Center][Big Right]]

[[Left][              Center              ][Right]]

[[Big Left][          Center          ][Big Right]]

有什么想法吗？提前谢谢你。

Answer 1

我没有足够的声誉来评论您的答案，所以我提交作为答案。这是您要找的吗？

http://jsfiddle.net/yxFQK/

请记住，制作 jsfiddle 总是比尝试从视觉上/概念上进行解释更容易。如果您很好地解决问题，人们就更容易帮助您。