灵活的 div 水平和垂直定位，没有间隙答案

【问题标题】：flexible divs position horizontally and vertically with no gaps灵活的 div 水平和垂直定位，没有间隙
【发布时间】：2012-10-17 23:05:51
【问题描述】：

我想根据容器的宽度以相同的宽度和不同的高度水平和垂直动态定位 div。

我想把它们堆叠起来

| 1 | 2 |

| 3 | 4 |

| 5 |

问题是 div 之间存在空白。即使我在左边添加明确的第 1 和第 5

我仍然有差距。

是否可以使用 css 来实现？

EDIT:

容器宽度可能会改变（即，如果用户拖动其边框）。然后内部的 div 应该正确对齐以占据内部的整个空间。可能的结果如下：

| 1 |

| 2 |

| 3 |

| 4 |

| 5 |

或

| 1 | 2 | 3 |

| 4 | 5 |

或

| 1 | 2 | 3 | 4 |

| 5 |

或

| 1 | 2 | 3 | 4 | 5 |

【问题讨论】：

【解决方案1】：

如果您只想使用 CSS，我认为最适合您的是设置两列。在第一列中，您将输入 1、3 和 5，在第二列中输入 2 和 4。这样就不会出现任何空格。

编辑： 如果你想在没有空格的情况下堆叠这些 div 并且仍然拥有灵活的布局，你不能只在 CSS 中做到这一点，但你可以尝试使用 Isotope 一个非常易于使用的 jQuery 插件。

【讨论】：

【解决方案2】：

试试这个：我创建了一个类列，并在这些列中添加了内容。可能不是您需要的，但它会起作用...

【讨论】：