div溢出是隐藏的，但仍然可以使用键盘右箭头键滚动

Question

我有一个奇怪的问题，当然，我知道这是一个CSS问题，但无法弄清楚确切的问题在哪里。

在浏览器中，您无法看到'whatwedo_container'，因为它的父div已隐藏溢出，但是当您按右键或在ipad中水平滚动时，可以查看空白区域。

我的HTML代码

<div class="aboutus">
    <div class="about_container">Some visible Content</div>
    <div class="whatwedo_container">Some hidden content</div>
</div>

CSS

.aboutus {
    background: #20407B;
    margin-top: 0;
    overflow: hidden;
    width:100%
}
.about_container {
    margin: 170px auto 0;
    position: relative;
    width: 1100px;
    background:green;
}
.whatwedo_container {
    background: none repeat scroll 0 0 transparent;
    position: absolute;
    right: -100%;
    width: 100%;
    overflow:hidden;
    background:red;
}

jsfiddle：http://jsfiddle.net/squidraj/wsYFh/

请帮助。谢谢。

Answer 1

将position: relative;添加到.aboutus

检查http://jsfiddle.net/wsYFh/2/