当 window 大小减小到 500px 时滑块向左拉

Question

正在尝试为我们的城镇建立一个 wordpress 网站。响应式设计有问题。在我们将 window 的宽度缩小到 596px 之前，该页面运行良好。此时右侧的文本开始占据更多的垂直 space 并且滑块开始占据更少的水平 space.

无法创建工作代码段，因为这是使用 wordpress 插件，但这里有一个 link 到有问题的页面：

https://www.sustainablewestonma.org/our-story-2/

非常感谢任何有关如何解决此问题的帮助或建议。

Answer 1

如果我没理解错的话。将 vw 更改为 %，然后根据您的需要进行相应调整。它似乎解决了问题。

.os-left {
    margin-top: 1.5%;
    width: 45%;
    margin-right: 1%;
    margin-left: 1.5%;
    margin-bottom: 2.5%;
}
.os-right {
    width: 45%;
    margin-right: 1.5%;
    margin-left: 1.5%;
}

而且您可能也不希望 body 也移动，因此要修复它，请使用 min-width: 95% 而不是 min-width: 500px；

html, body {
    min-width: 95%;
}

当 window 大小减小到 500px 时滑块向左拉

slider pulls to the left as window size decreases to 500px

css

wordpress

responsive-design