具有多行

时间:2016-07-23 10:35:21

标签: javascript html css reactjs

我正在尝试创建滑块。现在我有这样的事情:

enter image description here

一切都在一排,但我希望有类似的东西:

enter image description here

因此,我希望能够在滑块中设置多行。

更新

这是jsfiddle

1 个答案:

答案 0 :(得分:1)

添加样式

<div class="row"></div>
.row {
  width: 100%;
  clear: both;
}

所以它会像

<div class="outterDiv">
  <div class="innerDiv">
    <div class="row">
      <div class="item">Item 1</div>
      <div class="item">Item 2</div>
      <div class="item">Item 3</div>
      <div class="item">Item 7</div>
      <div class="item">Item 8</div>
      <div class="item">Item 9</div>
    </div>
    <div class="row">
      <div class="item">Item 4</div>
      <div class="item">Item 5</div>
      <div class="item">Item 6</div>
      <div class="item">Item 10</div>
      <div class="item">Item 11</div>
      <div class="item">Item 12</div>
    </div>
  </div>
</div>

更新了jsfiddle https://jsfiddle.net/69z2wepo/50082