Safari上的不同CSS

我为标题编写的CSS在safari上运行不好，但在其他web浏览器上运行良好

我遇到的问题是，在chrome等浏览器上，我的徽标上的

边距顶部是
-30px
，但在Safari上它需要
-15px

我已经尝试了一些东西，但它不会带我去任何地方。这是我尝试过的一个例子：

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari and Chrome */
    .header-center-items {
    margin-top: -30px;
    }

    /* Safari only override */
    ::i-block-chrome,.header-center-items {
     margin-top: -15px !important;
    }
}

这不是一个精确的解决方案，但更多的是一个解决方案。
您可以选择以下选项：

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari and Chrome */
    .header-center-items {
      margin-top: -30px;
    }

    /* Safari only override */
    ::i-block-chrome,.header-center-items {
      position: relative;
      top: 15px;
    }
}

让我知道它是否有效。
这不是一个精确的解决方案，但更多的是一个解决方案。
您可以选择以下选项：

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari and Chrome */
    .header-center-items {
      margin-top: -30px;
    }

    /* Safari only override */
    ::i-block-chrome,.header-center-items {
      position: relative;
      top: 15px;
    }
}

让我知道它是否有效。
谢谢您抽出时间，但safari似乎没有阅读“覆盖”，因为当我检查时，我没有看到它anywhere@AkramTarioui嗯，看来你再也不能用那个选择器了。然后，您只需要使用一些简单的javascript来解决这个问题。请看这个，我真的不知道把javascript放在哪里，这是一个wordpress网站，我只是在更改CSS，你知道我可以在哪里添加脚本吗？我是开发人员领域的新手，感谢您的回复。感谢您抽出时间，但safari似乎没有阅读“覆盖”，因为当我检查时，我没有看到它anywhere@AkramTarioui嗯，看来你再也不能用那个选择器了。然后，您只需要使用一些简单的javascript来解决这个问题。请看这个，我真的不知道把javascript放在哪里，这是一个wordpress网站，我只是在更改CSS，你知道我可以在哪里添加脚本吗？我是开发者世界的新手，谢谢你的回复。