css媒体查询无法正常工作

Question

我有一个div（语言模块），它位于页面标题上的图像顶部。 div有一个＆＃34;绝对＆＃34;位置使其保持在图像的顶部。

问题是当窗口的宽度调整到1499px以下时，浏览器没有加载正确的css，因为它使用第二个媒体查询（max-width：1500px）

其他上述媒体查询工作正常！

@media (max-width: 2500px) {
    .mydiv{position:absolute; top:0; left:0; padding-left: 920px;padding-top: 160px;}
}

@media(max-width:1500px) {
    .mydiv{position:absolute; top:0; left:0; padding-left: 920px;padding-top: 160px;}
}

} @media(max-width:1499px) {
    .mydiv{position:absolute; top:0; left:0; padding-left: 700px;padding-top: 130px;}
}

我在编写这些查询时需要帮助。

由于

Answer 1

尝试切换到最小宽度，看看是否能解决您的问题。或者，如果没有解决它，你将不得不尝试这样的事情：

@media (min-width: 1500px) and (max-width: 2499px) {
    .mydiv{position:absolute; top:0; left:0; padding-left: 920px;padding-top: 160px;
}

Answer 2

在最后一次媒体查询之前有一个额外的括号!!

对不起，

Answer 3

删除在最后一次媒体查询@media（max-width：1499px）之前以粗体标记的括号。还有一个额外的支架

@media (max-width: 2500px) {
.mydiv{position:absolute; top:0; left:0; padding-left: 920px;padding-top: 160px;}
}

@media(max-width:1500px) {
.mydiv{position:absolute; top:0; left:0; padding-left: 920px;padding-top: 160px;}
}

**}** @media(max-width:1499px) {
.mydiv{position:absolute; top:0; left:0; padding-left: 700px;padding-top: 130px;}
}