Chrome位置元素与Firefox不同

我在页面顶部有这些按钮，问题是Chrome浏览器显示的这些按钮的右边有80px。我究竟做错了什么？Chrome位置元素与Firefox不同

这是一个按钮的风格：

#engleza1{ 
position: relative; 
top:0px; 
left: 788px; 
width: 51px; 
height:42px; 
} 
#engleza1:hover{ 
position: relative; 
top:0px; 
left: 788px; 
width: 51px; 
height:42px; 
background:url(../images/engleza.png) no-repeat; 
cursor: pointer; 
}

，这是它们的包装风格：

#wrap{ 
width:100%; 
height: 1950px; 
text-align: center; 
margin:0 auto; 
overflow: hidden; 
background:url(../ong.png) center no-repeat; 
}

HTML：

<div id="wrap"> 
<div id="engleza1"> 
//nothing here 
</div> 
... 
</div>

来源

2012-09-18 Claudiu Creanga

嗨，现在它的罚款http://jsfiddle.net/gPGTf/1/ –

是的，我看到上的jsfiddle没关系。所以我的代码有问题，这使得这些div的行为就像这样，不是吗？ –

好的，我想我知道问题可能是什么。 Chrome正在显示背景图片：ong.png更大。所以包装div必须更大，这就是为什么这些div放错了位置。我该如何解决这个问题？ –

你好你的一些代码重复所以将它移除并归还此

#wrap{ 
height: 1950px; 
text-align: center; 
margin:0 auto; 
overflow: hidden; 
background:red; 
} 
#engleza1{ 
position: relative; 
top:0px; 
    left:788px; 
width: 51px; 
height:42px; 
    background:yellow; 
} 
#engleza1:hover{ 
background:green; 
cursor: pointer; 
}

为演示变化根据您的布局

live demo

来源

2012-09-18 08:12:46

是的，但我认为最好的方法是使用一些精灵并像那样解决它。谢谢！ –

Chrome位置元素与Firefox不同

回答

相关问题