Unk*_*ror 5 html css google-chrome
这里有一个例子http://jsbin.com/oqisuv/
CSS
body {
background:#e7ebf2 url(http://i.imgur.com/R2VB6.png) center repeat-y;
}
.menu {
width:989px;
margin:auto;
height:100px;
background:#666666;
line-height:100px;
text-align:center;
color:#fff;
}
Run Code Online (Sandbox Code Playgroud)
HTML
<body>
<div class="menu">Hello</div>
</body>
Run Code Online (Sandbox Code Playgroud)
如果您在Google Chrome上查看上面的示例,您会看到.menu
看起来像是margin-left:-1px
或margin-right:1px
.
在Firefox和IE上,它看起来很棒.我该如何解决这个问题?
小智 3
@media screen and (-webkit-min-device-pixel-ratio:0) {
html {
margin-left: 1px;
}
}
Run Code Online (Sandbox Code Playgroud)
body {
background:#e7ebf2 url(http://i.imgur.com/R2VB6.png) 50% 0 repeat-y;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
body {
background-position: 50.001% 0;
}
}
Run Code Online (Sandbox Code Playgroud)
http://philfreo.com/blog/fixing-safaris-1px-background-image-centering-problem/
归档时间: |
|
查看次数: |
13011 次 |
最近记录: |