overflow-x：hidden仍然可以滚动
问题是：
我有一个全宽的酒吧菜单，这是通过在右侧和左侧创build一个大的余量。 这个边距应该被overflow-x: hidden所裁剪，并且是…没有滚动条，一切（视觉上）都可以。
但是，如果您拖动页面（使用Mac Lion）或滚动到右侧，页面将显示一个巨大的条，该条应该已被overflow-x:hidden裁剪。
CSS
html { margin:0; padding:0; overflow-x:hidden; } body { margin: 0 auto; width: 950px; } .full, .f_right { margin-right: -3000px !important; padding-right: 3000px !important; } .full, .f_left { margin-left: -3000px !important; padding-left: 3000px !important; }
这是一个链接： http : //jsfiddle.net/NicosKaralis/PcLed/1/
你必须在草稿中看到… jsfiddle css以某种方式使其工作。
@Krazer
我有和像这样的结构：
body div#container div#menu_bar div#links div#full_bar div#content_body ...
#container是一个居中的div，固定宽度为950px，#full_bar是一个在整个窗口上从一侧延伸到另一侧
如果我把宽度100％#full_bar只会得到里面的宽度，而不是窗口的宽度
我不认为有什么方法可以防止在不使用JavaScript的情况下滚动元素。 然而，使用JS，将scrollLeft设置为0 onscroll非常简单。
我有这个完全相同的问题。 我通过把overflow-x: hidden; 在body和html 。
html { margin: 0 auto; padding: 0; overflow-x: hidden; } body { margin: 0 auto; overflow-x: hidden; width: 950px; } .full { background: red; color: white; } .full, .f_right { margin-right: -3000px !important; padding-right: 3000px !important; } .full, .f_left { margin-left: -3000px !important; padding-left: 3000px !important; }
<div> <div class="full"> abc </div> </div>
还有一种方法可以用一行代码来解决这个问题：
body { /* All your regular code including overflow-x: hidden; */ position:relative; }
这解决了我在webkit（Mac）上的问题
参考： http : //www.tonylea.com/2010/safari-overflow-hidden-problem/
html, body { overflow-x: hidden; width: 100%; }
解决了这个问题，除了IE浏览器 – 你仍然可以拖动网站的权利，如果你努力这样做。
使用overflow: hidden; 删除垂直滚动条，所以这不是一个解决scheme。
我无法设法使用JavaScriptfind更好的解决scheme。
我在这里find了解决schemehttps://stackoverflow.com/a/9399429/622041
你将不得不围绕你的内容#wrapper 。 overflow:hidden在body上将无法正常工作。
#wrapper {position: absolute; width: 100%; overflow-x: hidden}
在这里的HTML：
<html> <head> <title></title> </head> <body> <div id="wrapper"> <div class="yourContent"> ... </div> </div> </body> </html>
来自Weaver的Offcanvas演示http://jasonweaver.name/lab/offcanvas/
用以下内容包装：
width: 100%; overflow: hidden;
这只限于宽度，并在类似场合下也拖动了滚动阻止。
尝试固定位置的HTML元素，但是这个禁用滚动两个方向。
html { position: fixed; }
在<body>和<html>标签上的溢出也适用于我。
如何设置内容正文的宽度，并绕过#menu_bar和#content_body的#container ？
body div#container div#menu_bar (absolute positioned) div#links div#full_bar div#content_body (relative positioned + padding [#menu_bar height]) ...
CSS示例 。
考虑使用HTML的最大宽度。
如果它不工作，让我张贴。
