Snap.js和bootstrap，填充滚动条的位置(在android设备上)

Question

我使用snap.js (jakiestfu)与bootstrap相结合。当我在标准的"internet"浏览器中查看android上的页面时，我得到滚动条将在正常浏览器中的填充(见图片http://s27.postimg.org/61osu9y03/example.jpg)。

这个填充只发生在snap.js的主内容容器上，而不是你所看到的滑动面板上。这是。snap-content:

的css

<pre>
.snap-content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 2;
  overflow-y:scroll;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translate3d(0, 0, 0);
     -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
       -o-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
</pre>

-当我将位置设置为相对位置时，填充将消失。

-当我设置溢出为隐藏或删除溢出标记时，填充将消失。然而，这与标记发生了冲突。

下面是一个工作示例http://koenjacobsdesign.nl/vf/index.html

请记住:(据我所知)这个问题只发生在android标准的"互联网"浏览器上，它在移动chrome上工作得很好。

Answer 1

最终我自己解决了这个问题，下面是我的解决方案，也许将来对别人有帮助:

在一个接一个地排除和包含所有样式表并拆开css代码后，我能够隔离问题来自何处。很明显，当你添加一个方框阴影到"。snap-content"容器。我用边框替换了盒子阴影，现在效果很好。