0

这是网站。

我有一个奇怪的“文本显示”错误，它只发生在 Mac OSX 的 Chrome 上。我已经在 5 台 iMac 和 Macbook 上尝试过，但都以不好的方式显示文本。我知道在 Windows Chrome 中它看起来不错...

我有一个足够高的子菜单，可以超过我放在页面上的 API Google Map。问题是如果子菜单在地图上，文本（具有白色 css 属性！）变为灰色漫反射样式。

这是CSS：

#contact_map{
    width: 537px;
    height: 340px;
    float: left;
}

#map_canvas{
    width:100%; 
    height:100%;
}

#header #header_box ul#mainnav ul.submenu.big .submenu_big_box li a {
      text-transform: none;
      font-size: 12px;
      color: white;
}

这就是问题所在：

在此处输入图像描述

它应该看起来如何（只是白色字体）：

在此处输入图像描述

如果您float:left从#contact_map. 地图下降，文本显示为白色。

我已经尝试过所有其他浏览器，它似乎只发生在 Mac OSX 的 Chrome 上，关于如何解决这个问题的任何想法？

4

2 回答 2

1

我在带有 Chrome 的 MBP 上看起来很奇怪。我认为这就是你想要的：

-webkit-text-stroke: 0.35px

资料来源：加强 WebKit 中的枯燥文本

有了它，它看起来像这样：

在此处输入图像描述

于 2012-12-13T16:46:41.130 回答
0

我在带有 Chrome 的 OS X 10.7 上，它对我来说看起来是白色的。这些是我计算出来的样式：

color: white;
cursor: auto;
display: inline;
float: none;
font-family: avenirnext_lt_pro_ultlightRg;
font-size: 12px;
height: auto;
line-height: 15px;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
overflow-y: visible;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
text-align: left;
text-decoration: none;
text-transform: none;
width: auto;

也许您可以在 chrome 中检查您计算出的样式以确保它们正常？

于 2012-12-13T16:44:46.790 回答