填空 space

Question

大家好，这是我的问题（请访问图片link）：http://dominioestudio.com/example.png

我正在制作一个网站，但我不知道如何用下面的元素（那个进入 cian 矩形的元素）填充红色 space。

这是来自那些元素的代码（灰色内容）

.post {
  background: #CCC;
  width: 48%;
  margin: 10px 1%;
  float: left;
}

我不能使用绝对位置，因为这个网站的信息每天都会变化（所以我需要每个元素都能够适应/填充 space 而不管其他元素的高度）。

想法？

编辑：有些人让我做一个 jsfiddle。这是：http://jsfiddle.net/sirmarcio/bLo5v79v/

Answer 1

您可以使用 css 属性：

.item {
  flex-grow: <number>; /* default 0 */
}

这定义了弹性项目在必要时增长的能力。它接受一个作为比例的无单位值。它规定了项目应占用弹性容器内的可用空间 space 的数量。
如果所有项目都将 flex-grow 设置为 1，则每个子项都将在容器内设置为相同大小。如果您给其中一个子项赋值 2，则该子项占用的 space 是其他子项的两倍。
负数无效。
此 link 将帮助您了解有关 flex 属性的更多信息：
https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Answer 2

您可以在 .grid-wrap 中使用 columns: auto 2;，在 .post 元素中使用 display:inline-block;：Fiddle

填空 space

Fill empty space

html

css

css-float

fill

autofill