CODEWITHSUNDEEP
htmlcss
Anush Shetty
Anush Shetty

Reputation: 225

Setting the height of div with unordered lists dynamically

Do I need to manually specify the height of a div which contains unordered list?

When I have it like this, main1 and main2 div overlap if I don't set the height of the div. Is there a way of doing it without specifying the height?

<div id='main1'> <ul> <li> </li> <li> </li> <li> </li> </ul> </div> <div id='main2'> <ul> <li> </li> <li> </li> <li> </li> </ul> </div>

Upvotes: 0

Views: 428

Answers (4)

Jogendra
Jogendra

Reputation: 111

Use position:relative property for two DIVs

Upvotes: 0

Shakti Singh
Shakti Singh

Reputation: 86476

have you tried with float property to float left or right? 

#mail1 { float:left };
#mail2 { float:left };

Thanks

Upvotes: 3

mingos
mingos

Reputation: 24552

They won't overlap unless they're absolutely positioned or have other CSS magic applied to them, such as negative margins. Check that first and apply the necessary corrections.

Nonetheless, if you need to retrieve the dimensions of an element dynamically, for instance to dynamically position a highlight in a lava lamp-style menu, use jQuery:

$('#element').outerWidth();
$('#element').outerHeight();

Upvotes: 0

Chris Morgan
Chris Morgan

Reputation: 90912

If they're overlapping, you've almost certainly got some other CSS applying to it. Use a debugging tool like Firebug for Firefox, the Developer Tools in Chrome/WebKit or the What's-It-Called Thingummy in IE, and look at the applied styles for the div/ul/li.

Upvotes: 0

Related Questions