最近我尝试了this method 在其容器外增加我的 div 背景颜色。一切正常，除了在移动浏览器上将 overflow-x 应用于 body 并没有真正起作用。我的意思是当你向左滑动时仍在滚动(同样的效果你可以实现它如果您在桌面上按键盘上的向右箭头)。那么我们如何才能在使用此方法时完全禁用移动设备上的水平滚动？
这是我的 jsfiddle: http://jsfiddle.net/kzgvL6ba/
这是我的例子: HTML:
<body>
<article>
<div class="extendfull">Full-width Bars</div>
</article>
</body>
CSS:
body
{
overflow-x: hidden;
}
article {
background-color: #DDDDDD;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
display: block;
margin: 0 auto;
padding: 0 10px;
width: 60%;
}
div.extendfull {
background-color: #ccf;
border: 1px solid #66c;
font-size: 1.8em;
font-weight: normal;
padding-left: 3000px;
margin-left: -3000px;
padding-right: 3000px;
margin-right: -3000px;
}
谢谢!
最佳答案
不确定这是否是您正在寻找的解决方案，但添加另一个容器以删除向右滚动并获得相同的结果(我认为......)
<body>
<div style="overflow-x: hidden">
<article>
<div class="extendfull">Full-width Bars</div>
</article>
</div>
</body>
关于html - 在容器外展开 div - overflow-x 移动问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26864712/