Html：容器 div 大小为零的可能原因答案

【问题标题】：Html: possible reasons why container div can be zero sizedHtml：容器 div 大小为零的可能原因
【发布时间】：2010-07-31 18:25:58
【问题描述】：

我想知道为什么 div 元素在包含 html 布局时有时会被归零。我想设置背景颜色，但徒劳无功。我使用萤火虫调查布局并注意到一些 div 是空的。

例如，这个脏 HTML（属性值被...省略）的 div 是零大小的：

    <div id="..." style="background-color:#f00; ">                                          
      <a id="..." href="javascript:void(0);" class="reportTitle"
onclick="reportClick(...)" style="float: left">...</a>
      <img id="..." class="hidden" src="..." style="padding: ..."/>
   </div>

我应该怎么做才能避免这些问题？

提前感谢您！

【问题讨论】：

标签： html css layout

【解决方案1】：

只需将 overflow:auto 添加到您的容器 div 中：

style="background-color:#f00; overflow:auto;"

【讨论】：

哦，谢谢！您提供的解决方案即使没有高度也绝对有效！但是我的 div 大小为零的原因是什么？我什么时候应该在 div 中添加 overflow: auto 以及什么时候可以省略这个属性？
@Andrew：见：quirksmode.org/css/clearing.html。当您的父容器 div 浮动时，您应该添加溢出。