滚动条不会出现在Chrome和Safari中

Question

我的网站有以下CSS：

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, 
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, 
img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, 
center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, 
tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
html {overflow-y:scroll;}
h1 {
    display: block;
    margin:auto;
}
ul{ list-style-type:none; }
body {
    direction:rtl;
    padding-top:10px;
}
#wrapper {
    width:790px !important;
    padding:0px;
    margin:0px auto auto auto;
    border-radius:5px;
    overflow:hidden;  !important;
}
#page_banner { float:left; }
#content {
    float:right;
    width:790px;
}
.panel_content {
    height:auto;
}

这是我页面的基本结构：

<div id="wrapper">
    <div id="page_banner"></div>
    <div id="content" class="panel_content"></div>
<div>

div content是动态的 - 根据从DB收到的数据，它由其他div填充。所以它的高度不断增长。问题是 - 当这个div比屏幕更长时 - 我看到FF，Opera甚至IE中的滚动条。但是在Chrome和Safari中我没有看到它。更糟糕的是，在Safari中，我甚至无法使用鼠标滚轮滚动页面，我可以在其他浏览器中执行此操作。 为什么会发生这种情况？我该如何解决？我试图在body元素上使用overflow-y:scroll; - 我看到条形图出现了，但它被禁用了，我无法用它滚动。