水平滚动的大小,如何防止漂浮从包装
问题描述:
走了,我有如下因素HTML和CSS:水平滚动的大小,如何防止漂浮从包装
HTML:
<div id="container">
<div id="scrollbox">
<div id="content">
<div id="subcontent">
<p>bla bla bla bla bla bla bla</p>
<p>...</p>
</div>
</div>
</div>
</div>
CSS:
#container {
width:500px;
margin:0px auto;
}
#scrollbox {
overflow:auto;
overflow-y:hidden;
border:1px solid #f2f2f2;
}
#subcontent {
width: 10000px;
}
#content p {
width: 60px;
height: 40px;
float: left;
margin-left: 30px;
}
#scrollbox, #content p {
height: 140px;
}
所以我有一个大的水平<div id="subcontent">
填充bla bla
。我希望它可以水平滚动。
问题:该解决方案只适用于chrome。在其他浏览器中,scrollWidth是10000px。 (换句话说,滚动条很小,滚动区域太长)
任何其他的想法,使其在所有的浏览器上工作?我想摆脱我的width: 10000px;
。
答
您可以设置x的溢出滚动条将始终存在,
我不明白你为什么它在第一个设置为10,000像素宽地点。 Quote:_“我想摆脱我的宽度:10000px;”_那么为什么不摆脱它呢?不要试图成为一个聪明人,但不清楚你试图达到什么样的结果。 – Sparky
我只是想要水平滚动,就像jsFiddle工作示例,因为它现在在铬上。 'width:10000px;'是我发现制作水平滚动条的唯一技巧(如果你踢这个宽度,滚动条消失)。我想在每个浏览器上都有相同的滚动条行为,如果在您的解决方案中,您没有'width:10000px;',我会很高兴。 –
小提琴不会出现在我身上。但是,还有其他方法可以创建一个不带实际滚动条的水平滚动div。 http://flowplayer.org/tools/demos/scrollable/index.html看看这个伟大的jQuery脚本。 – Jrod