水平滚动与动态元素

Question

我已将平方元素连续显示在屏幕扩展名上.

这些元素是动态的,然后我有2个,因为我有50个.取决于屏幕的大小和我有多少元素我将有溢出.当发生这种情况时,我想显示水平滚动.

按照这里,我试图拨弄

代码:

HTML

<div class="wrap-poltrona">
    <div class="poltrona"></div>
    <div class="poltrona"></div>
    ...
    <div class="poltrona"></div>
    <div class="poltrona"></div>
</div>

CSS

.wrap-poltrona{
}
.poltrona{
    width: 100px;
    height: 100px;
    background-color: red;
    float: left;
    margin: 5px;
}

Answer 1

使用inline-block而不是float,在CSS上添加:

.wrap-poltrona{
  white-space:nowrap;
  overflow:auto;
}
.poltrona{
  display:inline-block;
}

演示http://jsfiddle.net/M5X3a/2/