浏览器之间的绝对定位不同

时间:2014-03-29 03:09:30

标签: css cross-browser positioning

我注意到我的三个绝对定位的文本里面的div在Internet Explorer和firefox中有一个位置,在chrome和safari中略有不同。这是什么原因和解决方案?

它们的位置如下

 style="position: absolute; left: 100px; top: 270px; width: 499px;"

并位于相对定位的元素内。

可以找到有问题的页面here。问题在于数字图像旁边左侧的三个文本组。

1 个答案:

答案 0 :(得分:0)

看起来在Chrome和FF中呈现的字体大小存在一些问题。文本与数字不对齐,因为在chrome和IE8中h1内容有两行,而在FF中它是单行。而且我不是专家说出为什么会这样。

要解决此问题,请尝试为h1提供较小的字体大小,例如:

<h1 style="position:relative;top:-15px; font-size:30px; line-height:34px;">How to Make Your First Website</h1>

我建议你避免使用html中的内联样式,而是在CSS中编写样式,因为它可以让你更容易地改变样式