Custom CSS on mobile

时间：2020-05-24 作者：Mike Woods

我想问你们几个问题。已为移动设备设置自定义css

    @media only screen and (min-device-width: 601px) and (max-device-width: 736px) 
@media only screen and (min-device-width: 300px) and (max-device-width: 600px)
@media only screen and (min-device-width: 300px) and (max-device-width: 600px)
在帖子和页面上一切正常。但当我在主页上时，如果我将手指向右移动，页面就会向右滚动。我希望它是静态的，就像在页面和帖子上一样。你能帮帮我吗？

页面任意预测。com公司

2 个回复
SO网友:Victoria Whitehead

尝试添加溢出：隐藏到。包

    @media only screen and (max-width: 767px)
#wrap {
    width: 100% !important;
    overflow: hidden;
}

SO网友:Tony Djukic

这只意味着你有一个元素打破了屏幕宽度的限制；我在构建时每隔几个站点就会遇到这个问题。首先查看任何固定或绝对定位的元素。然后开始查看可能已为其宽度声明了固定的#####px值的元素。如果失败，我通常会打开我的开发工具，将鼠标悬停在代码视图中的元素上，查看它们的计算宽度。最后一个选项，在CSS文件的顶部添加：

html *{border:1px solid #000;}
这将在每个元素周围添加一个黑色边框。然后找出哪一个延伸到屏幕右侧，并调整需要调整的内容。

Update:

我只是自己测试了我的答案，让每个元素都有一个粉红色的边框，老实说，这似乎是问题的一部分：

.vc_row{
  margin-right:-15px;
  margin-left:-15px;
}
您有一组div标记，看起来像这样：

<div class="vc_row wpb_row vc_row-fluid vc_custom_1590328177632 vc_row-o-equal-height vc_row-o-content-middle vc_row-flex">

他们都打破了页面的限制。不仅在移动设备上，甚至在台式机上。可能想和OceanWP开发团队或WPBakery的人员核实一下，看看他们是否能解决这个问题。有了这些页面生成器和第三方主题，您可以通过在此处和那里切换设置来构建站点，很快就会忘记您在何处设置的内容，这些内容最终可能会对整个页面产生级联效应。

标签： css   小码农  

相关推荐

全文与摘录的自定义css(内容选项)

有没有办法通过自定义CSS或其他方式激活“完整帖子”？现在我被主页上的摘录所困扰，而我的主题定制器>缺少内容选项以下是我的主题（名为博客写作）应该提供但没有提供的内容：/或者可以用这个吗？https://gist.github.com/thefuxia/2973189非常感谢。