6

Web ページを開発していますが、クロス ブラウジング テストをテストすると、CSS スタイルが Google Chrome および Safari 5 と競合するようになりました。

すべてのブラウザー (firefox、chrome、opera) 用の私のコード

.flex-direction-nav-featured a{
       margin-top: 4%;
   }

私はこれを試しますが、うまくいきません

/* 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 ハックはありますか? 私は多くのことを試しましたが、どれもうまくいきませんでした。

4

2 に答える 2

13

疑似クラスを介して 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%;
    } 
}
于 2013-07-04T14:30:45.640 に答える
2 
@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari only override */
    ::i-block-chrome,.flex-direction-nav-featured a {
        margin-top: 5%;
    } 
}
于 2014-02-12T08:09:28.557 に答える