Обтекание родительского div вокруг плавающих элементов

Question

Я пытаюсь получить div, чтобы обернуть динамическое число дочерних элементов, и я хотел бы сделать это, не устанавливая значение для ширины родительского элемента.

У меня есть обертка содержимого, плавая как дочерний, так и родительский элементы, моя проблема в том, когда дочерние элементы переносятся на следующую строку, свободное пространство осталось справа, и я хотел бы, чтобы родительский обернуть «намертво».

Я создал демо здесь: http://jsfiddle.net/UMgct/4/

#parent показывает текущее поведение, я хотел бы, чтобы вести себя как # parent2 и # parent3, но без явного задания ширины. Я вижу, почему поведение для #parent верное, я просто не вижу никакого способа получить поведение, которое я бы хотел.

Любые идеи будут высоко оценили

Answer 1

Во-первых, вы должны изменить «родитель» и «ребенок», чтобы быть классы вместо идентификаторов. Идентификаторы должны быть уникальными идентификаторами, а классы могут использоваться столько раз, сколько вы хотите.

С учетом сказанного, вы можете добиться того, что вы хотите с JQuery (предполагается, что идентификаторы теперь изменено на классы):

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