safari 5的CSS黑客

我正在开发一个网页，当我进行交叉浏览测试时，我发现我的CSS风格与我的google chrome和safari 5有冲突

我的所有浏览器代码（firefox、chrome、opera）

我试过这个，但不管用

/* 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%;
   } 

}

---

是否有只针对Safari 5的CSS攻击？我尝试了很多方法，但都没有成功。

您可能希望尝试通过伪类阻止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%;
    } 
}

---

你能说得更具体些吗？什么在Chrome中起作用？什么在Safari中不起作用？这是在PC上的Safari吗？是的，它在PC和Laptop上的Safari上。正确的解决方案可能不是求助于CSS黑客。代码中可能还忽略了其他内容。你能提供更多的源代码或工作示例吗？这里可以使用JS提琴！当然，也可以在Q中发布代码，因为这是常见问题解答的状态。

@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%;
    } 
}

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari only override */
    ::i-block-chrome,.flex-direction-nav-featured a {
        margin-top: 5%;
    } 
}