Question

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

在此代码中：

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

Answer 1

可能是这样的。这是几年前工作的Firefox的黑客攻击。尚未使用最新的Firefox进行测试。

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

来源：http://css-tricks.com/snippets/css/css-hacks-targeting-firefox/

Answer 2

您可以使用@supports来破解它。

使用@supports
允许本机功能检测，类似于Modernizr

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

div {
  width: 100px;
  height: 100px;
  background: red;
}

@supports (-moz-transform: translate(0, 0)) {
  div {
    margin-top: -50px;
  }
}

<div></div>

仅在Firefox中应用CSS规则

2 个答案: