html - 第二种CSS样式不会覆盖第一种

.review-stars .nt-testimonials footer {
    margin-top: 0px;
    float: right;
}

@media only screen (max-width:40em){
    .review-stars .nt-testimonials footer {
        float: none!important;
    }
}

这基本上就是我的代码。即使我添加了该行代码以提高响应度，该元素仍然是float：right。
我究竟做错了什么？

我添加到@media部分的其他类都可以正常工作

最佳答案

我想你错过了“和”。

@media only screen and (max-width:40em) {

}

每个MDN


  关键字“和”用于将多个媒体功能组合在一起，以及将媒体功能与媒体类型组合在一起。基本的媒体查询（包含所有媒体类型的单个媒体功能）可能如下所示：

@media (min-width: 700px) { ... }

  但是，如果您希望仅在横向显示时才应用此功能，则可以使用and运算符将媒体功能链接在一起。

@media (min-width: 700px) and (orientation: landscape) { ... }

  现在，只有视口宽度为700像素或更宽且显示为横向时，上述媒体查询才会返回true。但是，如果仅在所涉及的显示器是电视媒体类型的情况下才希望应用此功能，则可以使用and运算符将这些功能与媒体类型链接起来。

@media tv and (min-width: 700px) and (orientation: landscape) { ...  }

关于html - 第二种CSS样式不会覆盖第一种，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32144066/