当有很多article
时,我想使滚动条水平,而不是让它们向下跳。所以我希望它能够滚动,这样你就可以看到其余的。但没用。
代码段:
#latest {
background: #eee;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
overflow-x: scroll;
overflow-y: hidden;
height: 150px
}
article {
width: 250px;
height: 150px;
background: #ccc;
margin-right: 30px;
float: left
}
<div id="latest">
<div id="wrapper">
<article></article>
<article></article>
<article></article>
<article></article>
<article></article>
<article></article>
</div>
</div>
最佳答案
将文章设置为display:inline-block
而不是float:left
,并将wrapper设置为white-space:nowrap
,如下所示:
http://jsfiddle.net/andyfurniss/tobrbf7q/