如何使用 flex-item，让每一个div水平排布，一行排不下可以自动排到下一行？

要实现每个 div 水平排布，并在一行排不下时自动排到下一行，可以通过使用 Flexbox 的属性实现。

首先，创建一个具有 `display: flex;` 属性的父级容器。这将使子元素成为 flex items，并且默认水平排布。

然后，为了让子元素在一行排不下时自动换行，需要添加 `flex-wrap: wrap;` 属性。

下面是一个示例代码，展示了如何实现这个需求：

HTML:

<div class="container">
  <div class="flex-item">Flex item 1</div>
  <div class="flex-item">Flex item 2</div>
  <div class="flex-item">Flex item 3</div>
  <div class="flex-item">Flex item 4</div>
  <div class="flex-item">Flex item 5</div>
</div>

CSS:

.container {
  display: flex;
  flex-wrap: wrap;
}

.flex-item {
  /* 在这里设置 flex-item 的样式 */
}

在上面的示例中，`.container` 是父级容器，`.flex-item` 是子元素。通过设置 `.container` 的 `flex-wrap: wrap;` 属性，当子元素在一行排不下时，会自动换行。

你可以根据需要对 `.flex-item` 进行样式设置，如设置宽度、高度、间距等。

希望这个示例对你有帮助！如果还有其他问题，请继续提问。