【问题标题】:rendered font in IE7 width is bigger than in other borwsersIE 7 中呈现的字体宽度大于其他浏览器
【发布时间】:2011-12-16 20:16:39
【问题描述】:

IE7渲染的字体比其他浏览器大(上图为IE9,下图为Firefox):

HTML:

            <div id="header_tools">
                <a href="#">Support</a> | <a href="#">FAQs</a> | <a href="#">Sitemap</a> | <a href="#">Help</a>
            </div>

和 CSS

    div#header_tools {
        font-size: 14px;
        font-weight:  normal;
        color: #918e8e;
        float: left;
    }

    div#header_tools {
        position: relative;
        top: 7px;
        left: 680px;
    }

    div#header_tools  a {
        font-size: 14px;
        color: #918e8e;
    }

有人知道为什么会这样以及如何解决吗?

【问题讨论】:

  • 您是否尝试将 div#header_tools a 上的填充设置为 0
  • 是的。这没有任何意义,因为 div#header_tools 继承了 padding: 0px
  • 当您使用您发布的确切代码进行测试并且没有额外内容时是否会出现问题?屏幕截图来自不同的设置。而且代码非常简单,问题很可能出在其他地方。字体是什么也可能很重要,这在代码中没有指定。

标签: css internet-explorer html fonts


【解决方案1】:

这似乎与字间距有关(这也是一个 CSS 属性)。最简单的可能是使用&amp;nbsp; 而不是空格。

(似乎字体抗锯齿/提示也有所不同。) 抱歉,我认为字体渲染造成了细微的差异。

【讨论】:

    【解决方案2】:

    我建议将链接填充设置为 0 并将空格更改为 &amp;nbsp; 或根本不使用空格,而是使用填充。

    div#header_tools  a {
            font-size: 14px;
            color: #918e8e;
             padding:0;
        }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2016-11-23
      • 1970-01-01
      • 2015-02-27
      • 2019-12-08
      • 2017-06-20
      • 2012-09-30
      • 2012-07-31
      相关资源
      最近更新 更多