Question

我正在制作一个网站，它有几个信息表，我希望它们彼此相邻，但我希望它们居中，而不是

float: left;

它应该像居中的文本：如果它离开文本容器，它应该进入一个新行。

我试过

margin: auto;

但是这会把元素放在彼此之下，但是我希望它们彼此相邻，然后进入一个新的“线”，如果它们离开div，它们就在。

Answer 1

您可以使用flexbox

.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.table {
  padding: 1em;
  border: thin solid darkgray;
  width: 20%;
}

<div class="container">
  <div class="table">Table 1</div>
  <div class="table">Table 2</div>
  <div class="table">Table 3</div>
  <div class="table">Table 4</div>
  <div class="table">Table 5</div>
  <div class="table">Table 6</div>
</div>

表中的HTML中心元素没有叠加

1 个答案: