为什么宽度在我的媒体查询中没有生效？

Question

之前我从未遇到过这个问题，但出于某种原因，我无法修改媒体查询中的宽度。在开发人员工具中，宽度显示为像我切换到不显示一样被划掉，但事实并非如此，默认情况下会这样做。

我很想改变这个：

div.wrapper{
    display:block;
    width:100%;
}

进入这个：

.wrapper {
    width: 95%;
    margin: 0 2.5%;
}

我甚至尝试将我的媒体查询wrapper类更改为div.wrapper ...但它没有帮助，

导致这种情况的原因是什么？

Answer 1

我认为你应该阅读这篇文章： CSS: Understanding the selector's priority / specificity

使用CSS规则时优先考虑。

例如，.column .sponsors将优先于.sponsors

Answer 2

在媒体查询中，使用与以前相同的定义：

LineChartDataSet

Answer 3

在css中如果我们调用一个像attribute.classname（div.wrapper）这样的元素，它将比调用.classname（.wrapper）具有更多的优先级。

现在你有两种方法可以解决这个问题。

1. 更改调用方法（在main-css和media-query中使用相同的调用方式）。

2. 否则在.wrapper中的宽度后给出一个'！important'的adiitional属性。

   .wrapper {     宽度：95％！重要;     保证金：0 2.5％; }

Answer 4

关于.column .sponsors问题，您应该这样做：

@media screen and (max-width: 640px)
{
    .column .sponsors {
        width: 90%;
    }
}

这不会修改.column声明。