调整内容大小和重叠绝对 DIV 的负边距答案

【问题标题】：Negative margins to resize content and overlap absolute DIVs调整内容大小和重叠绝对 DIV 的负边距
【发布时间】：2015-05-26 00:03:57
【问题描述】：

我有一个 DIV，里面有两个绝对 DIV，一个在顶部，一个在底部，它们一起形成了一个漂亮的 UI 窗口。

DIV 内部还有确定父 DIV 高度的实际内容窗口。这里是a fiddle。

我试图让内容不局限于内部内容窗口，而是填充父 DIV。 好像 UI 的绝对 DIV 和内部内容 DIV 是一个 DIV。这将：

我能够使用特定的 CSS 对其进行硬编码（取消注释小提琴的注释部分）。

但我不能做的是弄清楚为什么margin-bottom: -20px 不将 -20px 应用于边距的底部并使父 DIV 缩短 20 像素。我发誓以前有效。今天不行。

【问题讨论】：

“为什么 margin-bottom: -20px 不将 -20px 应用于边距底部并使父 DIV 缩短 20 像素” – 因为 w3.org/TR/CSS21/box.html#collapsing-margins

【解决方案1】：

这可能很愚蠢，但是您是否尝试过浮动内部 DIV，据我所知，应该将其置于正常文本流之外，但仍保留父 DIV 和内部 DIV 应用的文本属性给它？

【讨论】：