Mac OS X上的webkit中的滚动条问题

Question

Chrome和Safari在我正在编码的网站上的滚动条上显示出一种奇怪的行为。

滚动条隐藏在：after和：before元素之下，如下所示：

使它们隐藏在块下的样式：

-webkit-backface-visibility: hidden;
margin-left: -2%;
display: block;
content: '';
width: 110%;
height: 60px;
margin-top: -30px;
-webkit-transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
transform: rotate(-2deg);
background: #fff;
padding-bottom: 30px;

有谁知道为什么滚动条的行为如此？