Html div溢出已隐藏，但仍可以使用键盘右箭头键滚动

我有一个奇怪的问题，当然，我知道这是一个css问题，但无法找出确切的问题在哪里

在浏览器中，您无法看到“whatwedo_容器”，因为它的父div是溢出隐藏的，但当您按右键或在ipad中水平滚动时，可以看到空白

我的HTML代码

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

jsfiddle：

---

请随时帮忙，请提前感谢。

添加

位置：相对至
.aboutus

选中
添加了位置，但当您从键盘上单击右箭头或滑动屏幕时，仍然可以查看白色隐藏部分。它已修复。另一个子容器的溢出未隐藏。非常感谢您指出这一点。
.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;
}