我在流畅的布局和文本对齐中修复宽度框：使用此发布的解决方案证明它们是正确的：
Fluid width with equally spaced DIVs
但是因为我在响应式布局中还有几行。
这当然会发生：
------ ------ ------ ------
| | | | | | | |
| | | | | | | |
------ ------ ------ ------
------ ------ ------ ------
| | | | | | | |
| | | | | | | |
------ ------ ------ ------
------ ------ ------
| | | | | |
| | | | | |
------ ------ ------
但我喜欢这样：
------ ------ ------ ------
| | | | | | | |
| | | | | | | |
------ ------ ------ ------
------ ------ ------ ------
| | | | | | | |
| | | | | | | |
------ ------ ------ ------
------ ------ ------
| | | | | |
| | | | | |
------ ------ ------
当然可以证明这是合理的，但是如果没有使用javascript来解决这个问题吗？
我认为text-align-last：left可以正常工作，但它没有，而且它还没有正式播出。
可能解决方案的想法：
我提出了一个可能的JavaScript解决方案，但我需要你的帮助。
以下是我对可能的解决方案的想法：
要使最后一行左对齐，我们实际上需要用隐形框填充缺少的空格。我们可以轻松地手动执行此操作，但div的数量是用户生成的并且始终不同。
因此，杂草需要知道丢失的盒子数量，并将它们附加到我们已经拥有的盒子上，以使其工作：
所以这是我的（婴儿）srcipting想法：
1. Count all divs
2. Divide them with 4 (cause we have 4 in a row)
3. If the SolutionA has no decimal, nothing will happen cause all is good
4. If the SolutionA has a decimal, remove it
5. SolutionA + 1 = SolutionB
6. SolutionB x 4 (cause we have 4 each in a row) = SolutionC
7. SolutionC - SolutionA = Number of divs we need to add.
我不知道是否有办法找出已经连续多少项将其传递给javascript。这将是一个很好的原因，然后公式将适用于响应式布局，而不会在每次随浏览器宽度变化时调整行号。
这是个好主意吗？
我希望有人愿意这样做。
这是一个小提琴： http://jsfiddle.net/L2mPf/
谢谢。
查看我的答案。
答案 0 :(得分：7)
好的，这是使用css的该死的简单解决方案：
只需添加许多连续多少个div（在本例中为4）并给它们高度为1px。
没有任何东西可以看，所有的作品都像没有javascript的魅力。
这是新的小提琴：http://jsfiddle.net/L2mPf/1/
感谢@GGG让我重新关注css和这个解决方案。
答案 1 :(得分：0)
您需要指定框的高度。在您的情况下，框的内容可能会因此而变化，因为框未对齐。
答案 2 :(得分：0)
为你的盒子设置了一个最小高度。
.box-class {
min-height: 100px;
height: auto !important;
height: 100px;
}
100px包括IE6的最小高度修复
您可能还希望向左浮动（和显示块）您的框，然后clearfix父容器，以便在对齐问题仍然存在时保持打开状态。 （链接中clearfix css的示例）