CODEWITHSUNDEEP
css
Neil
Neil

Reputation: 2902

How to increase the height of an element with absolute positioned elements inside

I have a ul which is positioned relatively with absolute positioned lis inside it .How do i increase the height of the ul according to the content.

Adding class clearfix to the ul does not work

Upvotes: 3

Views: 413

Answers (2)

João Mosmann
João Mosmann

Reputation: 2902

You can use JQuery

var totalHeight = 0;
$('ul>li').each(function(i,el){

    totalHeight += $(el).height();


});

$('ul').height(totalHeight);

May you need to sum the top position or margin to get the correct height.

Upvotes: 2

Mike Brant
Mike Brant

Reputation: 71422

When you use absolute positioned elements, they are actually removed from layout of the element from which they are placed, so you cannot grow the containing element automatically with size changes to the absolute positioned elements. You could utilize javascript techniques to calculate the size of the absolute positioned LI's and then set the height of the containing UL accordingly.

Upvotes: 4

Related Questions