How can I stop div's from overlapping

EDIT: How can I get a site to grow vertically with the content? Look at this site http://pimpriots.com/test/ and you can see that the rounds highscores have out grown the main div even though it is inside that div.

You could try something like:

#divID {display:block;
width:300px;}

If you want the next div to sit along side this one then add float:left;

Make sure that you include a margin as well. That will prevent overlapping.

Divs are block level by default anyway.

How are you positioning these divs? I’m wondering if you’re using Absolute Positioning? Using AP isn’t wrong as such - it’s just difficult to get right.

Using Floats or just relying on the natural flow of the page is more reliable and much much easier to master.

Thank you everyone for the help, I have fixed that problem.

Now I have another question.

How can I get a site to grow vertically with the content? Look at this site http://pimpriots.com/test/ and you can see that the rounds highscores have out grown the main div even though it is inside that div.

Can’t get at the link I’m afraid.

But you get the site to grow vertically by not setting a height - or at least only a min-height.

Just a note with floated Divs, you might need to set an image with vertical repeat to get a background to fill the empty content since DIV’s are mainly as high as their content.

Thank you everyone for your replies! The site is back now. I will try setting a min height asap. Although the main black column of the site should always be touching the top and bottom of the browser so I’m not sure if min-height:100% would work?