Question

我有一个父Div容器，里面有5个div。父div的宽度为960px，高度为320px。内部元素向左浮动并具有设定宽度。

没有足够的宽度/空间容纳5个项目以适应960宽的父div，因此自然它使最后一个div浮动到底部。

有没有办法让它向右滑动并添加滚动条以水平滚动？

Answer 1

您可以合并Case和white-space: nowrap以防止元素被包装。添加display: inline-block父级获取滚动条。这是一个例子：

overflow: scroll

.parent {
  overflow: scroll;
  background-color: lightblue;
  white-space: nowrap;
 }

.some-child {
  width: 200px;
  display: inline-block;
 }

<div class="parent">
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
  <div class="some-child">Some Text</div>
</div>

CSS |使div浮动到右边并将滚动条添加到父

1 个答案: