找出某种计算出的 CSS 样式的原因

Question

我<div>在一个网页上有一个 633px 的计算高度属性。这未在任何级联样式表中设置，无论是否内联，也未在 javascript 中设置。我在我的代码中到处搜索，但数字 633 没有出现在任何地方。我可以通过设置style="height: 420px;"我想要的高度来解决这个问题，但 IE 似乎将其覆盖为 633px，我也会在其他浏览器中默认设置。我已经在 Google Chrome 和 Firefox/Firebug 中验证了 div 的实际内容远不及 633 像素高。有什么办法可以找出这个计算高度的原因吗？为完整起见，以下是 Google Chrome 报告的<div>.

Computed Style
background-color: white;
display: block;
float: left;
height: 633px;
margin-left: 30px;
margin-top: 20px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
width: 830px;

Inline Style Attribute
margin-left: 30px;
margin-top: 20px;

#overview
background-color: white;
float: left;
padding: 0px;
width: 830px;

#overview, #overviewempty
margin-top: 9px; (is crossed out)

div
display: block;

提前致谢。

编辑：

问题中的 div 包含两个 div，一个在 中包含一行文本font-size: 16px;，一个高度为 367px。

另一个编辑：

好的，所以我想出了是什么原因造成的。主 div 包含的第二个 div 包含一个图像，以及一个浮动在该图像右侧的 div，使用position: relative; top: -335px;. Internet Explorer 保留了此元素原本为空白的空间。有什么办法吗？

最终编辑：

解决了！我将浮动 div 的内容用 包裹position: relative在第二个 div 中position: absolute，这样就去掉了主图像下的空白 :) 最终的 HTML 看起来像这样：

<div id="overview">
  <div>Some text>
  <div>
    <img src="someImage.jpg">
    <div style="float: right; position: relative; top: -335px;">
      <div style="position: absolute; top: 0px; left: 0px; background-color: white; width: 365px;">
        Some floating contents
      </div>
    </div>
  </div>
</div>

Answer 1

安装Internet Explorer 的IE 开发人员工具栏。有时它会让生活变得更加轻松。编辑：新版本的 IE 默认包含开发人员工具，可通过按 F12 访问。