IE 6 中的 height 属性表现得很奇怪答案

【问题标题】：height property in IE 6 acting weirdIE 6 中的 height 属性表现得很奇怪
【发布时间】：2010-10-24 06:56:35
【问题描述】：

简单的问题（我希望）

我有一个 div：

用css：

.break{position:relative;height:1px;background-color:#555555;margin:5px 10px 10px 10px;}

这个 div 在 IE 6 中显示为大约 10-20px 厚的线？？？ ...在任何其他浏览器中都可以正常工作

任何提示将不胜感激，..谢谢..

安德鲁

【问题讨论】：

标签： html internet-explorer-6

【解决方案1】：

设置

overflow: hidden;

到 .break 应该可以解决问题。

IE 只为内容保留最小空间（保留的空间等于为此元素设置的 line-height 或 font-size - 记不清了）。在所有其他浏览器中，如果没有足够的空间，内容就会流出容器。 IE 拉伸容器。因此，将溢出设置为隐藏即可解决问题。

【讨论】：

很高兴能帮上忙。祝你有美好的一天:-)

【解决方案2】：

如果没有看到完整的 HTML 标记，很难确定，但这很可能是由于 IE 6 在 quirks 模式下渲染盒子模型 [1]。为了让 IE 6 使用标准模式，请确保您在 HTML 页面的开头明确声明了一个文档类型：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">

如果您使用的是 XML 文档类型，请确保您不是从 XML 声明开始的。如果在 doctype 标头之前有 XML 声明，IE 6 将退回到 quirks 模式。如果您使用的是 XML 文档类型，您的标题应如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

不是这个：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

[1]http://en.wikipedia.org/wiki/Quirks_mode

【讨论】：