父级div高度不增加

Question

我遇到了一个问题，就是当子元素增长时，无法让父元素扩展其高度（弗洛伊德？ :-))

示例页面在此处

这里的父级元素是“main_bottom”，其中包含“main_mid”及其子元素。

结构有点不同寻常，因为文本必须位于圆角内部，这些圆角很大，所以我无法使用通常的“固定顶部 - 动态中间 - 固定底部”的例程。

当然，可怕的粉红色和红色只是为了方便看到子div的尺寸..

任何帮助都将不胜感激

祝您有愉快的一天

- samoyed

---

链接指向停放的域名。垃圾邮件？ - polarblau

把以下與編程相關的內容從英文翻譯成中文。僅返回已翻譯的文本：抱歉，連結在幾分鐘前還可以使用。我正在調查這個問題.. 再次道歉。 - samoyed

Answer 1

文本的父容器之一具有固定高度，文本被浮动但未清除。从#main_bottom中删除height: 135px（可能替换为min-height）规则，并将overflow: auto规则添加到#main_mid以清除浮动并使布局按预期工作。

- slikts

---

并不是我遇到的完全相同的问题，但足够相似，你提醒溢出的方式解决了它。谢谢！ - David van Driessche

Answer 2

添加这些定义

#main_bottom {
  min-height: 600px;
  overflow: auto;
}


#main_mid {
  overflow: auto;
  height: auto;
}

当使用overflow: auto和height: auto时，容器将适应其内部内容。

- Xavier Barbosa

---

注意，使用您的解决方案创建了一个滚动条，在我使用Reinis建议的解决方案时没有出现。 也许无论如何我都可以设法摆脱它... 再次感谢。 - samoyed

Answer 3

我遇到过这些问题几次。我的解决方案是在子div中添加display:block;，在父div中添加height:auto;。

div.parent {
    ...
    height: auto;
    ...
}
div.child {
    ...
    display: block;
    ...
}

- yujohnnyzhou