Сделайте div, отрегулируйте его высоту до абсолютно позиционированных детей.

Question

У меня есть элемент div (по умолчанию), содержащий и h1, и ссылку, обе из которых имеют абсолютное позиционирование. Естественно, высота элементов div сворачивается. Как заставить элемент div отрегулировать его высоту до двух его детей? Я попробовал стандартные clearfixes, установив переполнение в auto и установив позицию div относительно (это было предложение из другого сообщения, которое я нашел), но ни один из них не работал.

Я сделал jsfiddle, что иллюстрирует мою проблему.

HTML код:

<div> 
    <h1>the div doesnt go around this element</h1> 
</div> 

CSS код:

div {border: 2px solid;} 
h1 {position: absolute;} 

Answer 1

Использование мин-ширина для DIV в CSS так, что она покрывает высоту, необходимое для детей.

Answer 2

Я сделал jsfiddle помочь вам решить эту проблему с помощью JQuery: https://jsfiddle.net/9hubfbxt/

HTML-код:

<div id="parent"> 
    <div id="child1" class="child"> 

    </div> 
    <div id="child2" class="child"> 

    </div> 
</div> 

JQuery:

var height = 0; 
$("#parent .child").each(function() { 
    height = height + $(this).outerHeight(true); 
}); 

$("#parent").height(height); 

Сейчас высота может быть что-нибудь в зависимости от того, что внутри.

EDIT: я отредактировал jsfiddle с моим Jquery обходным: https://jsfiddle.net/4yuco4cL/1/