force float:left divs不要去下一行

Question

假设我有20个相同的div与float:left属性和一些宽度.我希望它们在一行中,如果它们不适合屏幕只是为了使页面水平滚动.

小提琴

Answer 1

这基本上就是浮动的工作方式.如果您想要所描述的行为,您可以改为做其他事情,例如white-space: nowrap;在容器上而display: inline-block;不是浮点数.

http://jsfiddle.net/NPzsV/3/

.container {
    white-space: nowrap;
}
.line {
    display: inline-block;
    width: 200px;
    vertical-align: top;
    white-space: normal;
}

有一点需要注意:使用这种方法,div之间的换行符/空格/制表符将在渲染中导致它们之间的空格.