3

请注意,我已经浏览了有关该主题的现有链接,但似乎对我的情况没有帮助。

所有人都建议了一种如何垂直移动文本以使其看起来对齐的方法。我的问题是它已经在 Chrome 中对齐,所以当我尝试为 Firefox 对齐文本时,它会在 Chrome 中对齐文本。

请在 Firefox (v12) 和 Chrome (v19) 中打开以下链接。

http://jsfiddle.net/UQ4D5/

您会注意到它在 Firefox 中向顶部移动,但在 Chrome 中完全对齐。

4

3 回答 3

4

你的 CSS 中有两个属性

 display: table-cell;
    vertical-align: middle;

检查现场演示http://jsfiddle.net/UQ4D5/5/

于 2012-05-29T05:39:20.777 回答
1

学习使用reset.cssnormalize.css来防止浏览器渲染模型的细微差异。

然后使用height=line-height技巧:

div {
    font-size: 100px;
    text-align: center;
    height: 120px;
    line-height: 120px;
    border: 1px solid black;
}

铬指标:
在此处输入图像描述
火狐指标:
在此处输入图像描述

两种情况下的高度相同。

于 2012-05-29T05:45:29.160 回答
0

该问题基于浏览器默认样式表。我建议您使用正确的重置样式表甚至normalize.css

于 2012-05-29T05:36:51.697 回答