Safari 5 的 CSS hack
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15939775/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS hack for safari 5
提问by gadss
I am developing a web page and when I test for cross-browsing testing I got my CSS style got conflict with my google chrome and my safari 5.
我正在开发一个网页,当我进行跨浏览测试时,我的 CSS 样式与我的 google chrome 和 safari 5 发生冲突。
my code for all browsers ( firefox, chrome, opera)
我的所有浏览器代码(firefox、chrome、opera)
.flex-direction-nav-featured a{
margin-top: 4%;
}
I try this one but it wont work
我尝试了这个,但它不起作用
/* for safari only (wont work)*/
::root .flex-direction-nav-featured a{
margin-top: 5%;
}
/* for safari only (but works with chrome also)*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* works with sfari and chrome */
.flex-direction-nav-featured a{
margin-top: 5%;
}
}
Is there a CSS hack which only targets Safari 5? I have tried many things but none worked.
是否有仅针对 Safari 5 的 CSS hack?我尝试了很多东西,但都没有奏效。
回答by user2550776
You might want to try to block chrome via a pseudoclass:
您可能想尝试通过伪类阻止 chrome:
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari and Chrome */
.flex-direction-nav-featured a{
margin-top: 4%;
}
/* Safari only override */
::i-block-chrome,.flex-direction-nav-featured a{
margin-top: 5%;
}
}
回答by Sagar
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari only override */
::i-block-chrome,.flex-direction-nav-featured a {
margin-top: 5%;
}
}