无法阻止使用overflow-x：hidden进行水平滚动

Question

正如标题所说我有一个对象，如果我使用我的滚动鼠标仍然可以让我水平滚动（尽管这些条是隐藏的）。仅在OS X的safari上发生这种情况。

你能看看我的CSS并告诉我为什么吗？以及如何解决它？此外，位置必须是绝对的，以免破坏事物。

menu {
    position: absolute;
    float: none;
    background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);  
    background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
    background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
    top: 107px;
    height: 74px;
    width:100%;
    z-index: -90;
    overflow-x: hidden;
}

谢谢你们。

编辑：我应该提一下，html是<menu></menu>，CSS是如上所述，我想创建一个灰色的渐变矩形。