0

我有一个奇怪的问题。

在我的页面上，http://radiovalerie.org/ - 包含在超链接标签中的文本被略微向下推，好像它应用了一些额外的“行高”属性，但我不知道这个属性在哪里在 CSS 中被调用。

示例：页面右侧的“通过 → iTunes • Winamp • WindowsMedia 收听”。“Listen via”部分是正常的，但是一旦超链接开始出现在它之后，就好像它们具有不同的行高。

我已经直接梳理了网站的 .css 文件，并使用 Chrome 的元素检查器窥探了代码，但我似乎无法找到导致超链接文本看起来略微偏离的罪魁祸首。

有人有什么想法吗？

4

3 回答 3

2

您的 reset.css 第 20 行包括

vertical-align: middle;

当我在 Safari 元素检查器中取消此行时，有问题的文本跳回与“Listen via ...”一致。

您可以通过添加来覆盖它

vertical-align: top;

进入 style.css，在第 166 行开始的块中。

最初的问题很可能是由该字体中标准文本的高度<a>与应用了重置 css 的元素高度的差异引起的。

于 2012-04-17T13:48:01.087 回答
2

在你的第 20 行reset.css你有

vertical-align: middle;

这就是文本被推送的原因。

简单地将其删除或更改为top您的链接。

于 2012-04-17T13:51:08.003 回答
0

在 FireFox 中，链接显示比文本略高。禁用 style.css 中 a 标签的底部填充会使它们向下移动到与文本相同的位置。

在 Chrome 中，禁用vertical-align: middlereset.css 似乎可以解决问题。这似乎是一个奇怪的 CSS 重置设置。同样的更改还修复了 FireFox 中的显示而不更改填充。

考虑到 Chrome 和 FireFox 在显示上的细微差别，您可能需要考虑使用不同的 CSS 重置。

于 2012-04-17T13:49:27.357 回答