@Media 查询（最小宽度）CSS 不适用于某些分辨率答案

【问题标题】：@Media query (min-width) CSS is not applying to certain resolutions@Media 查询（最小宽度）CSS 不适用于某些分辨率
【发布时间】：2017-07-31 23:41:24
【问题描述】：

（重复，因为我的最后一个问题失去了吸引力，清理了一些不需要的信息并添加了额外的相关信息）

我的任务是开发一个 Wordpress 网站，并且一直在摆弄 CSS。我现在遇到了@media 查询问题

我只需要为 3 个分辨率（公司标准）开发网站。我不明白自动缩放在网站中的工作原理，因此我决定为 3 种特定分辨率（1920x1080、1440x900、1024x768）中的每一种进行硬编码。

在这种情况下，它用于侧边栏（其他元素也不起作用）。我所做的位置更改（右：##px）不适用于 1440x900 用户，而是覆盖 1024x768 用户更改。

代码如下：

1024x768 位用户

 @media (min-width : 768px){
    .sidebar{
        right: 115px;
    }
 }

1440x900 用户

 @media (min-width : 900px){
    .sidebar{
        right: 555px;
    }
 }

1920x1080 用户

 @media (min-width : 1080px){
    .sidebar{
        right: 155px;
    }
 }

（更多图片和信息的Imgur链接：http://imgur.com/a/hMWIp）

【问题讨论】：

【解决方案1】：

您将媒体查询应用于所需分辨率的高度，而不是宽度。例如，对于分辨率1920x1080，您写道：

@media (min-width : 1080px){
        .sidebar{
            right: 155px;
    }
}

但应该是：

@media (min-width: 1920px) {
        .sidebar {
            right: 155px;
    }
}

无论如何，因为它是一个级联样式表，所以最后一个媒体查询会覆盖之前的。

【讨论】：

【解决方案2】：

经过一番挖掘，我发现 1440x900 分辨率实际上是从 1920x1080 部分接收更改。

不是 100% 确定为什么会这样，除了同时为两种尺寸开发之外，我没有其他解决方法。

如果其他人将来有此问题，请发布此问题。

【讨论】：