仅在 Firefox 中应用 CSS 规则

Question

如何让 margin-top : -5%; 在 Firefox 中仅应用？

在此代码中：

#snap {
    width: 100%;
    overflow: hidden;
    margin-top: -5%; // only apply in Firefox
}

Answer 1

可能这行得通。这是多年前对 Firefox 的黑客攻击。尚未使用最新的 Firefox 对其进行测试。

  @-moz-document url-prefix() { 
      #snap {
         margin-top: -5%;
            }
  }

Answer 2

您可以使用 @supports 破解它。

Allows native feature detection, similar to Modernizr, using @supports

在下面的代码中，如果浏览器支持 -moz-transform: translate(0, 0)，margin-top: -50px 将应用于 div。

div {
  width: 100px;
  height: 100px;
  background: red;
}

@supports (-moz-transform: translate(0, 0)) {
  div {
    margin-top: -50px;
  }
}

<div></div>

Only apply a CSS rule in Firefox