为什么这个 div 的计算高度会过大？答案

【问题标题】：Why would this div have an unnecessarily large computed height?为什么这个 div 的计算高度会过大？
【发布时间】：2011-01-28 09:31:28
【问题描述】：

问题是 div#dditem_2（带有“看一看...”文本的 div）的计算高度大约为 500 像素，而我在 CSS 中找不到任何原因，这推动了下面的 UL它真的很远。

我发现如果你在侧边栏设置display: none 或position: absolute（或任何其他将其从元素流中删除的东西），那么底部的 UL 会像它应该的那样向上移动，所以看起来可能是 UL正在尝试清除侧边栏，但我也不知道为什么会这样。

到目前为止，我已经在 Firefox 和 Chrome 中重现了该问题。有什么想法吗？

【问题讨论】：

【解决方案1】：

看起来有很多 div。您是否尝试在 div 周围放置边框：1px 纯红色以查看它们可能接触的位置？

【讨论】：

【解决方案2】：

这是由于v2basic.1263412699.css中的以下规则：

.overwrap .button-bar:after,#content .item:after,#content .blogcomment:after
{
  content:".";
  display:block;height:0;clear:both;visibility:hidden
}

从此规则中删除 content:"."; 或从 #dditem_2 中删除类 item。不知道它的用途是什么，但它让高度变得疯狂。

【讨论】：

#dditem_2 有 class="item html 3" 所以我在你的样式中搜索了 .item 的定义（html 和 3 类是假的）。 .item 只有几条规则，而内容是唯一不寻常的，所以我用 Firebug 将其删除以验证。