我的css中的一些媒体查询被忽略

我有以下css。前“4列”媒体查询有效，其余被忽略。如果我在“1-column”之前加上“5-columns”，那么其中一个有效，但“1、6和7”被忽略。如果我把6放在上面，那么1可以工作，但是1和5被忽略。无论我把2、3和4列放在哪里，它们都能继续工作。我看不出有什么问题。我希望任何人都能帮助我

#header-wrap {
    border-bottom: 1px solid #EFEFEF;
    margin: 32px 32px 16px;
    padding: 0 0 32px;
}

/* 1 column */
@media all and (max-width: 607px) {
    #header-wrap {
    width: 256px;
    }
}

/* 2 columns */
@media all and (min-width:607px) and (max-width:895px) {
    #header-wrap {
    width: 544px;
    }
}

/* 3 columns */
@media all and (min-width:895px) and (max-width:1183px) {
    #header-wrap {
    width: 832px;
    }
}

/* 4 columns */
@media all and (min-width:1183px) and (max-width:1471px) {
    #header-wrap {
    width: 1120px;
    }
}​

/* 5 columns */
@media all and (min-width:1471px) and (max-width:1759px) {
    #header-wrap {
    width: 1408px;
    }
}​

/* 6 columns */
@media all and (min-width:1759px) and (max-width:2062px) {
    #header-wrap {
    width: 1696px;
    }
}​

/* 7 columns */
@media all and (min-width:2062px) {
    #header-wrap {
    width: 1696px;
    }
}​

开始工作了

出于某种原因，在一些结束方括号后面有点。不知道他们从哪里来

为了达到同样的效果，我还减少了对媒体的查询，只需要更少的代码。粗略地说，有三种主要的屏幕定位方法。您可以让您的样式：

样式向下，例如

（最小宽度：320px）

，因此所有内容都向下调整到该尺寸

设置样式

（最大宽度：480px）

，所有大小都可以

括号

（最小宽度：320px）和（最大宽度：480px）

您所拥有的是括号，其中不允许媒体查询中的样式级联，即1200px宽屏幕满足

（最小宽度：600px）

和

（最小宽度：1000px）

的要求，因此您只需将样式应用于较低值的查询，而必须基于特定括号分辨率重新应用样式，例如

（最小宽度：600px）和（最大宽度：800px）

这是一种完全合法的技术，但如果需要任何更改，您会发现最终需要维护更多的代码。这是我用艰苦的方式学会的。CSS设计为级联，媒体查询也是如此

最后，如果要使用括号方法，请尽量避免两次指定相同的分辨率

i、 e.

（最小宽度：320px）和（最大宽度：500px）

然后

（最小宽度：500px）和（最大宽度：900px）

因为这可能会混淆某些浏览器，或者在调整屏幕大小时导致闪烁，因为只有一个像素同时满足这两个条件。写它的安全方法是：

 `(min-width:320px) and (max-width:500px)`

然后

（最小宽度：501px）和（最大宽度：900px）

---

如果不能做到这一点，向上或向下的样式设置完全消除了这种可能性：）

Con请发布您的HTML代码？我已经复制了您的代码，事实上它不会从第五个媒体查询中激活css，使用CLASE而不是id不起作用，我尝试了几种方法，但都不起作用，如果有人知道这种行为，我会很感兴趣。这是html：这里的一些内容哇，谢谢你的回答和解释！在你看到点的地方，我看到了空格（所以我没有看到）。