Question

我的页面在safari，chrome，ff中看起来很棒，并且在IE8中优雅地降级，但我的客户端也需要IE7。

一个不起作用的小东西是我的H3。奇怪的是，我的H2运行正常。这不是失去风格的问题，这似乎是一个更常见的问题; H3根本就没有显示出来！我已经研究了这一点，并尝试了许多我认为推荐用于缺少样式的东西（包括缩放：1），但我无法解决这个问题。我最好的猜测是它与嵌套的div有关...

我也尝试过各种各样的doctypes，但无济于事......包括：

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

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

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

<!DOCTYPE html>

这是我的小提琴（有更完整的代码），以及下面的一部分：http://jsfiddle.net/cathi/2Kkh2/18/（当然它似乎在这里工作正常 - 不能在IE7机器上调出jsfiddle。嗯.. 。）

h2 {
    color:#007cc0; 
    font-size:1.4em;
    line-height:1.9em;
    font-family:'Tahoma',Helvetica,Arial,sans-serif;
    margin-top:0;
    margin-bottom:10px;
    padding-top:0;
    padding-left: 35px;
    padding-right: 8px;
    padding-bottom:0;
    font-weight:normal;
}

h3 {
    color:#ea752e; 
    font-size:1.4em;
    line-height:1.9em;
    font-family:'Tahoma',Helvetica,Arial,sans-serif;
    margin-top:0;
    margin-bottom:0px;
    padding-top:0;
    padding-left: 35px;
    padding-right: 8px;
    padding-bottom:0;
    font-weight:normal;
}

和，html（复制一些，但不是所有的div）

<div class="content-intro">
  <h2>Here is my H2 that shows up fine in IE7</h2>
<p>A paragraph of intro copy here</p>
</div>
<div class="content-checklists">

这是我的H3没有出现在IE7

中

Answer 1

您之所以看到这种奇怪的行为是因为IE7偶尔（或者我应该经常说？）在涉及浮点数时处理值的错误方式。最终，您的<h3>被推到图标图像下方，并且由于父级上有overflow:hidden，因此该元素不会显示（除非您以某种方式向下滚动）。

在.content-checklists-title的定义中，请尝试删除width:97%。

这仍然会在其他浏览器中产生所需的行为（感谢文本在浮动元素周围流动的方式），但也会避免IE7的滑稽怪癖。

我希望这就是你要找的东西！如果没有，请告诉我，我会很乐意尝试进一步帮助！

IE7失去了我的h3

这是我的H3没有出现在IE7

1 个答案: