html - 将父 div 包裹在 float 元素周围

Question

我试图让一个 div 包围动态数量的子元素，我想在不设置父元素宽度值的情况下执行此操作。

我通过 float 子元素和父元素获得了内容换行，我的问题是当子元素换行到下一行时右侧有剩余空间，我希望父元素换行“紧紧地”。

我在这里设置了一个演示:http://jsfiddle.net/UMgct/4/

#parent 显示当前行为，我希望它的行为像#parent2 和#parent3，但没有明确设置宽度。我明白为什么 #parent 的行为是正确的，我只是看不到任何获得我想要的行为的方法。

任何想法将不胜感激

Answer 1

首先，您应该将“parent”和“child”更改为类而不是 ID。 ID 是唯一标识符，而类可以根据需要多次使用。

话虽如此，您可以使用 JQuery 实现您想要的(假设 ID 现在已更改为类):

$(document).ready(function() {
    var numPerLine = parseInt($(window).width() / $('.parent > .child').outerWidth(true));
    $('.parent').width($('.parent > .child').outerWidth(true) * numPerLine);
});