0

这个问题已经有几天了,但我一生都无法弄清楚是什么原因造成的。一些谷歌搜索向我指出了一个崩溃的边距错误,但我认为我会得到一个明确的答案,或者至少会指向正确的方向。

我有一个绝对定位在相对 div 中的 div。这个 div 的位置因 mac 到 pc 而异。

下面的屏幕截图是在 Mac 上

文字不合适。

下面的屏幕截图是在 Windows 电脑上

文本到位

同样的问题也发生在 iOS 设备上,并且在浏览器中是一致的。

   <div style="position:relative;" id="section3">
<div class="highheader" style=" font-size:42px;position:absolute; top:-8px; left:25px; color:black;" id="categoryname">VIDEO HIGHLIGHTS</div>

以上是代码的文本片段。由于某种原因,它似乎只是解释了与机器不同的 top:-8px 绝对值。我这样设置的每个 div 都是一样的。我的服务器上存在此代码的一个版本,发生此问题。

www.atomichael.com/mmaplus

无论如何,我希望所提供的信息足够有用,如果不是,请不要犹豫,询问更多详细信息!

我真的很难过,所以任何帮助都将不胜感激。谢谢你。

4

2 回答 2

1

字体不是标准的。此外,您可以添加填充、高度或行高以进行一些调整,甚至调整您的位置。我将从字体开始。看:

http://www.w3schools.com/cssref/css_websafe_fonts.asp

于 2013-07-11T22:41:47.807 回答
0

只需设置top:0px,它将适用于以下情况divs

<div class="highheader" style=" font-size:42px;position:absolute; top:0px; left:25px; color:black;" id="categoryname">VIDEO HIGHLIGHTS</div>

<div class="highheader" style=" font-size:42px;position:absolute; top:0px; left:25px; color:black;" id="categoryname">LATEST NEWS</div>

<div class="highheader" style=" font-size:42px;position:absolute; top:0px; left:25px;" id="categoryname">PLUS BABES</div>

<div class="tileheader" style=" font-size:42px;position:absolute; top:0px; left:25px;" id="categoryname">LATEST POSTS</div>

其他选项是创建一个class并应用不同的 css forchrome和 forsafari

可能这个黑客可以工作

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari and Chrome */
    .myClass {
     top:-8px;
    }

    /* Safari only override */
    ::i-block-chrome,.myClass {
     top:0px;
    }
}

这是取自这里

于 2013-07-11T22:39:08.187 回答