1

我正在处理的网站有问题,我似乎找不到任何类型的解决方案。我遇到的问题在于该站点的顶部菜单:虽然它在大多数浏览器中看起来都不错,但有少数浏览器会通过在最后一项中添加额外的一行来“中断”菜单。

我一直在研究可能导致它的原因,问题似乎是浏览器处理字母间距的方式 - 一些浏览器,尤其是移动浏览器,似乎在字符之间添加了一个额外的像素,导致标题内容不适合其空间。即使整个站点的字母间距设置为零,也会发生这种情况:一些浏览器似乎只是添加了一个额外的空间,因此大多数浏览器使用为零的空间对它们来说是-1。

在解决这个问题时,我已经束手无策了,除了使用顶部菜单的图像之外,我想不出其他任何方法,这当然是一个糟糕的主意。所以我想问一下这里是否有其他人遇到过这样的问题,是否有人知道如何做到这一点,所以字符间距实际上是通过浏览器标准化的。

有问题的网站是这个:

http://maxworth.ca/blog/

您可以通过定期使用 chrome 来查看问题(看起来没问题),然后使用 chrome 开发工具将站点呈现为 Android 4.0.2 - Galaxy Nexus。这个问题似乎出现在一堆(主要是移动)浏览器上,虽然我知道该网站没有完全编码为在移动浏览器中看起来很完美,但这是我们目前遇到的一个破坏性问题。

提前致谢。

4

1 回答 1

2

我认为解决这个问题的一个好方法是让您的菜单项“证明”以填充容器的宽度,而不考虑字体大小、字母间距等,而不是试图操纵这些项目来填充空间。每个浏览器呈现文本的方式都略有不同,因此很难获得一致的外观。这个解决方案非常有效: 如何证明水平列表的合理性?

于 2013-09-23T18:39:39.893 回答