SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict
    Join Date
    Jul 2009
    Posts
    356
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    My DIV is not expanding correctly, should be easy fix.

    The div in question is "cbg" ... I have a 900px by 1px jpeg i want to use as the background. Its 2/3 white (like the left column) and 1/3 black (like right column)

    Any idea why it isn't expanding? You can see what I am trying to do if you enter in 1000px for the height attribute in the css.

    http://vismarkgroup.com/dev/H4H/faq.php

    Thanks!!!

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,750
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hi, the problem is that #cbg's childs are floats and as such they are collapsing that elements height. You need a clearing mechanism placed on it. Aka overflow:hidden;
    Code:
    #cbg{overflow:hidden;}
    However #info needs to be cleared from the header
    Code:
    #info{clear:both;}
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    SitePoint Addict
    Join Date
    Jul 2009
    Posts
    356
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RyanReese View Post
    Hi, the problem is that #cbg's childs are floats and as such they are collapsing that elements height. You need a clearing mechanism placed on it. Aka overflow:hidden;
    Code:
    #cbg{overflow:hidden;}
    However #info needs to be cleared from the header
    Code:
    #info{clear:both;}
    Perfect.. thanks so much Ryan

    Do you have any articles to suggest for me to read on css clears? Thats one concept I have never really grasped

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,750
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Just google containing floats .

    Basically it's very easy to understand.

    If you have floats, the direct parent needs a clearing mechanism, overflowauto or hidden), the clearfix, a clearing element, etc.

    It's very simple to understand.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •