使用 div 和 css/bootstrap 制作“流体网格”[关闭]答案

【问题标题】：Making a "fluid grid" with divs & css/bootstrap [closed]使用 div 和 css/bootstrap 制作“流体网格”[关闭]
【发布时间】：2020-05-31 01:25:21
【问题描述】：

是否可以使用原始 css 或引导程序创建类似的东西？我希望将它设置为每个按钮的大小固定，并以列表格式编写，我不必定义特定的行或列长度。例如：

<div class="grid">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>

但就像我说的，每个盒子项目都需要是一个边长精确的正方形。有人可以帮我解决这个问题吗？

【问题讨论】：

是的，有可能。

标签： html css bootstrap-4

【解决方案1】：

请在 css 中查看flexbox：

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

.box {
  width: 50px;
  height: 50px;
  border: solid orange 3px;
  margin: 10px;
}

<div class="grid">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>

【讨论】：