none
Div background color not showing RRS feed

  • Question

  • Hi all,

    This is a stupid question and I should know the answer but I cannot figure out why the body color is showing through my div on this page:

    http://pages.suddenlink.net/gmsdesigns/menucopy.html

    The body has the darker color but the content should be the light color. I used two divs to split the menu into columns (within the content). If I float the content everything work but I don't want to do that.

    I know it's simple; I know I've done it before, but I can't recall...

    George

    Thursday, May 26, 2011 12:06 PM

Answers

  • It shows through beacuse the left and right hand columns don't cover the centre area. You need to give the center section the same background as the menu columns.

    Now, you've developed the site in HTML5 without apparently considering how users with older browsers will see it. If you use the IE9 Developer Tools you can switch between IE9 mode and IE7 and IE8 modes. What you see differs substantially. A large proportion of users will be seeing it this way.

    Bear in mind that it will be a while before these older browsers disappear and you need to develop a site to cope with these and have it degrade 'gracefully'.

    HTH


    Ian Haynes

    EW V4 Add-Ins
    EW resources, hints and tips
    • Marked as answer by George44 Thursday, May 26, 2011 3:56 PM
    Thursday, May 26, 2011 12:49 PM

All replies

  • It shows through beacuse the left and right hand columns don't cover the centre area. You need to give the center section the same background as the menu columns.

    Now, you've developed the site in HTML5 without apparently considering how users with older browsers will see it. If you use the IE9 Developer Tools you can switch between IE9 mode and IE7 and IE8 modes. What you see differs substantially. A large proportion of users will be seeing it this way.

    Bear in mind that it will be a while before these older browsers disappear and you need to develop a site to cope with these and have it degrade 'gracefully'.

    HTH


    Ian Haynes

    EW V4 Add-Ins
    EW resources, hints and tips
    • Marked as answer by George44 Thursday, May 26, 2011 3:56 PM
    Thursday, May 26, 2011 12:49 PM
  • Thanks Ian,

     

    Another simple thing that I forgot! DUH!

    I tried this as an HTML5 exercise. It is not a real site. I do appreciate your comments, though and I will use the developer tools more frequently. For basic sites, I don't see much advantage to HTML5. I know there are lots of new elements and semantic tags, though.

    George

    Thursday, May 26, 2011 4:24 PM
  • I'm now using HTML5 for all new work. There are definitely some features of HTML 5, or in fact more CSS3, that can be used and degrade in older browsers without causing any problems, rounded corners and shadows for instance. It just needs care to ensure nothing breaks unacceptably in older browsers, mainly IE6,7 and 8.
    Ian Haynes

    EW V4 Add-Ins
    EW resources, hints and tips
    Thursday, May 26, 2011 5:10 PM