SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Zealot
    Join Date
    Jul 2006
    Posts
    112
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    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.
    Last edited by hawkal; Jul 22, 2008 at 07:58. Reason: changed topic

  2. #2
    SitePoint Evangelist elgumbo's Avatar
    Join Date
    Nov 2002
    Location
    North West, UK
    Posts
    545
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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;

  3. #3
    SitePoint Zealot Rexibit's Avatar
    Join Date
    Jul 2008
    Location
    United States
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Make sure that you include a margin as well. That will prevent overlapping.
    Rexibit Web Services
    Don't just build it - CSS it

  4. #4
    SitePoint Wizard bronze trophy Tailslide's Avatar
    Join Date
    Feb 2006
    Location
    Bedford, UK
    Posts
    1,687
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.
    Little Blue Plane Web Design
    Blood, Sweat & Rust - A Land Rover restoration project

  5. #5
    SitePoint Zealot
    Join Date
    Jul 2006
    Posts
    112
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  6. #6
    SitePoint Wizard bronze trophy Tailslide's Avatar
    Join Date
    Feb 2006
    Location
    Bedford, UK
    Posts
    1,687
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.
    Little Blue Plane Web Design
    Blood, Sweat & Rust - A Land Rover restoration project

  7. #7
    SitePoint Zealot Rexibit's Avatar
    Join Date
    Jul 2008
    Location
    United States
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.
    Rexibit Web Services
    Don't just build it - CSS it

  8. #8
    SitePoint Zealot
    Join Date
    Jul 2006
    Posts
    112
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •