背景中心与铬(错误)
Nao*_*den 7 css safari google-chrome background-image
我有一个居中的背景图片,Chrome显示偏移一个像素.
CSS
#container {
background: url("images/header.jpg") no-repeat scroll 50% transparent;
width: 100%
}
#header {
width: 986px;
margin: 100px auto 0 auto;
}
HTML
<html>
<body>
<div id="container">
<div id="header">centered content</div>
</div>
</body>
</html>
我想这与不同的浏览器如何处理CSS中的center-or 50%属性有关background:
是否有一个已知的(简单)黑客或替代方法来解决这个问题？背景容器必须是100%宽.
小智 5
如果您可以输出比浏览器窗口更宽的图像,那么应该修复它.
如果在这里找到解决方案 - http://philfreo.com/blog/fixing-safaris-1px-background-image-centering-problem/
对我来说，这成功了：
@media screen and (-webkit-min-device-pixel-ratio:0) {
html {
margin-left: 1px;
}
}
一旦我发现几天前得到了这个解决方案，我就会立即发布该解决方案的链接。在同一篇文章中，该人说问题出在容器宽度的奇数或偶数上。无论如何，这解决了我的问题。