移除 HTML/CSS 个图块之间的奇数间距

Question

这是间距的屏幕截图，我只是在寻找一种显示模式，使所有内容都适合它们的位置，而无需制作新行。

这是它的样子，但理想情况下我希望左侧没有空隙

我只是在寻找解决问题的显示设置（例如显示：任意；）

感谢任何帮助；D

Answer 1

如果您使用的是 Bootstrap，您可以使面板的顶行适合

<div class="row">

您想要的下一行需要在另一个 "row" class 中。代码应如下所示：

<div class="row">
  <div id="one" class="col-sm-2 panel panel-default">
    <div id="oskartommy"></div>
  </div>
  <div id="two" class="col-sm-2 panel panel-default">
    <div id="rorum"></div>
  </div>
  <div id="three" class="col-sm-2 panel panel-default">
    <div id="itsaka"></div>
  </div>
  <div id="four" class="col-sm-2 panel panel-default">
    <div id="mylittle"></div>
  </div>
  <div id="four" class="col-sm-2 panel panel-default">
    <div id="meow"></div>
  </div>
  <div id="six" class="col-sm-2 panel panel-default">
    <div id="lil_toxic"></div>
  </div>
</div>

<div class="row">
  <div id="one" class="col-sm-2 panel panel-default">
    <div id="joa"></div>
  </div>
  <div id="two" class="col-sm-2 panel panel-default">
    <div id="oskatommy"></div>
  </div>
  <div id="three" class="col-sm-2 panel panel-default">
    <div id="bausz"></div>
  </div>
  <div id="four" class="col-sm-2 panel panel-default">
    <div id="bntlol"></div>
  </div>
  <div id="four" class="col-sm-2 panel panel-default">
    <div id="flom"></div>
  </div>
  <div id="six" class="col-sm-2 panel panel-default">
    <div id="m0ew_tv"></div>
  </div>
</div>

尝试使用类似的方法来组织面板。我将所有列设为 2 列宽度只是为了均匀分布，但您可以根据需要使用 12 列响应式网格系统重新排列。

移除 HTML/CSS 个图块之间的奇数间距

Remove odd spacing between HTML/CSS tiles

html

css

display