响应式设计低于 480 不会响应

Question

这是我在开发者退出后进入的网站。我已经完成了一切，但我注意到它在 480 以下没有响应。

Here is the site

这就是我的想法

<meta name="viewport" content="width=device-width, initial-scale=1">

这里是该部分的 css：

@media only screen and (min-width: 321px) and (max-width: 480px) { There some css in here  }

这是某人创建的 wordpress 自定义模板。所以我几乎已经工作了很多小时试图找出它有什么问题。希望有人能帮忙！

Answer 1

这个 CSS 的意思是当屏幕宽度在 480 像素和 321 像素之间时，将应用媒体查询中所说的规则。如果这就是你想要做的，它似乎工作正常。这是一些测试 CSS 和 JSfiddle 结果（调整 JSFiddle 窗口的大小）

@media only screen and (min-width: 321px) and (max-width: 480px) { 
    body {
        background: red;
    }
}

您能否更具体地说明您要达到的目标，这对我来说似乎很好。

Answer 2

这应该回答你的问题：

#footer .partners {
    float: none;
    width: 494px;
    margin: 0 auto;
}

这个 div 永远不会小于 494px。它也不会让它的父级低于它最宽元素的宽度，也就是这个，这就是为什么整个网站不会低于这个宽度。