Advanced Search

Results 1 to 3 of 3

Thread: div collapses when i add floats

  1. #1
    Join Date
    Dec 2005
    Location
    Tempe, AZ
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default div collapses when i add floats

    Page: http://www.forbiddenmotorsports.com/foa/
    CSS: http://www.forbiddenmotorsports.com/foa/overall.css

    The problem occurs at the bottom. Obviously the text is meant to be next to each other (right and left divs in css). However, if I add float:left to both elements to line them up, the container div for them (footer) collapses and I lose the background color. Why is this happening? If I add a height to the div it will keep its shape when I float the elements, but the text is going to be dynamic so I don't want a set height.

    Basically, when the elements are floated the div sees no content in it and goes to height=0. How can I fix this?

  2. #2
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by 4bidden View Post
    However, if I add float:left to both elements to line them up, the container div for them (footer) collapses and I lose the background color. Why is this happening?
    Floating elements, just like absolutely-positioning them, removes those elements from the flow. It's almost as if they weren't there, though floating affects the horizontal positioning of nearby in-line content.

    Basically, when the elements are floated the div sees no content in it and goes to height=0. How can I fix this?
    Place an element after the floated elements, and then use the clear property with a value of left, right, or both (depending on the direction(s) you floated the elements). This will force that element below the floated content, expanding the container in the process.

    Mike

  3. #3
    Join Date
    Nov 2006
    Location
    England
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Just a quick side note, but your 'home' link goes to the forbidden motorsports homepage and not your Flavours of Arizona homepage.

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
  •