Grow your CSS skills. Land your dream job.

Need Help Getting BG Color to work for Div

  • # July 12, 2011 at 5:37 pm

    I am working on an assignment for school:
    http://weblab.devry.edu/WGD232DSUM11A/lpehrson/lab2/
    I cannot get the background-color to show up for the content div. It won’t work when I have the column divs on top of it.

    Both the CSS and XHTML validated.

    Any ideas why the background color won’t show up?

    # July 12, 2011 at 6:02 pm

    This is because you haven’t cleared your floats.

    Essentially, the content div only contains items which are floated. Floated items are taken out of the regular flow of the document, thus not giving the content div any height (in other words, the content div doesn’t think it is containing anything).

    This is perfectly fine and a tough concept for beginners to wrap their head around. Here’s a great article by Chris: http://css-tricks.com/795-all-about-floats/

    The easiest solution for you is adding overflow: hidden; to your div#content.

    Another solution would be to add a “clearing div” just before you #content div closes. HTML:

    	 

    CSS:

    .clear { clear: both; }
    # July 12, 2011 at 6:23 pm

    Aaa, thank you! It’s starting to make a lot more sense now :D.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".