无法隐藏垂直滚动条
问题描述：
我有一段文字，我希望能够滚动而不显示垂直滚动条。我跟着这个，但没有用，文本滚动，但滚动条仍然可见。 Hide scroll bar, but while still being able to scroll无法隐藏垂直滚动条
#activity_parent {
height: 100%;
width: 100%;
overflow: hidden;
}
#activity_child {
width: 100%;
height: 100%;
overflow-y: scroll;
padding-right: 17px; /* Increase/decrease this value for cross-browser compatibility */
}
<html>
<body>
<div id="activity_parent">
<div id="activity_child">
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
good<br/>bye.
</div>
</div>
</body>
</html>
答
是什么浏览器你，因为测试代码后，垂直滚动条没有显示在这里工作。
更妙的是放置一个style标签内的CSS如下图所示
<html>
<style>
#activity_parent {
height: 100%;
width: 100%;
overflow: hidden;
}
#activity_child {
width: 100%;
height: 100%;
overflow-y: scroll;
padding-right: 17px; /* Increase/decrease this value for cross-browser
compatibility */
}
</style>
<body>
<div id="activity_parent">
<div id="activity_child">
<!-- you content goes here -->
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
hello<br/>I<br/>am<br/>here<br/>
good<br/>bye.
</div>
</div>
</body>
</html>
那是因为你正在使用'高度; 100％'在父元素上，这意味着它将扩展以适应内容的全部高度。您将需要声明一个值，该值不受**内容高度的影响：它是'25％'，一个视口单位，一个固定像素/ em/rem/pt值。如果你说，设置父高度为200px，你会看到它的工作。 – Terry
嗨特里，使用50％仍然显示滚动条。为什么这个工作与高度：100％？ http://jsfiddle.net/5GCsJ/954/ – Dercni