Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Divs not shown in IE7 but very well in the rest of browsers

    I have a problem with my nested divs, I am creating a website but I can't see my footer in IE, what could be the problem? here is my code below:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Igihe|Kinyarwanda</title>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link href="index.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    a:link {
    text-decoration: none;
    }
    a:visited {
    text-decoration: none;
    }
    a:hover {
    text-decoration: none;
    }
    a:active {
    text-decoration: none;
    }

    /*-------------------------------------my page--------------------------------*/
    #bodypos{ position:relative; overflow: hidden; max-width: 1000px; align:center; border-collapse:collapse;}

    /*--------------------------------------my header--------------------------------*/
    #header{
    width: 1000px;
    height: 229px;
    background-color:#CCCCCC;
    border : 2px groove #0033FF;
    margin: 0px 0px 10px;
    }
    #logoposition{
    height:119px;
    width:170px;
    background-image: url(images/Logo.gif);
    float:left;
    }
    #banposition{
    height:120px;
    width:660px;
    background-image:url(images/banner.png);
    margin-left: 171px
    }
    #headpub{
    height:80px;
    width:990px;
    background-color: black;
    margin-left: 5px;
    }
    #menu{
    height:30px;
    width:1000px;
    background-image:url(images/homemenu2.gif);
    }
    /*---------------------------------my body----------------------------*/
    #contbd{
    position: relative; overflow:hidden;
    }
    /*-------left column.............*/
    #leftcol{
    width: 170px;
    height: auto;
    background-color:#CCCCCC;
    float:left;
    border: 1px groove #999999;
    overflow:visible;
    }
    /*-----center and right column------------*/
    #rightngb{
    float: left; margin-left: 15px; max-width: 900px; border: 1px solid #CCCCCC; overflow:hidden;
    }
    /*------center---------*/
    #centcont{
    width: 400px;
    height: 700px;
    background-color:#CCCCCC;
    float:left;
    border: 1px groove #999999;
    }
    .centcontpad{
    margin-left: 10px
    }
    #headnews{ width: 300px; height: 30px; color:#003366; text-align: center; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; font-weight:bolder; margin-left: 20px; padding: 5px}
    #newscont{ width: 400px; height: 300px; border:groove 1px #CCCCCC; background-color:#FFFFFF;}
    .newsp{ font-family:Arial, Helvetica, sans-serif; font-size:12px;}

    /*--------right column-------*/

    #rgtcol{
    width: 390px;
    height: 700px;
    background-color:#CCCCCC;
    border: 1px groove #999999;
    float: right;
    }
    </style>
    </head>
    <body
    <!--body positioning------>
    <div id="bodypos">
    <!-- header-->
    <div id="header">
    <div id="logoposition">
    </div>
    <div id="banposition">
    </div>
    <div id="headpub">
    </div>
    <div id="menu">
    </div>
    </div>
    <!--header ends here--->
    <!--body content-->
    <div id="contbd">
    <!--left column-->
    <div id="leftcol">
    </div>
    <!--left column ends here-->
    <!--center and right column-->
    <div id="rightngb">
    <div id="centcont">
    <div id="headnews">Amakuru yo mu Rwanda no hanze</div>
    </div>
    <div id="rgtcol"></div>
    </div>
    <!--center and right column end here-->
    <!--footer-->
    <div id="footer"></div>
    </div>
    <!--body content ends here-->
    </div>
    <!--body positioning ends here-->
    </body>
    </html>

    Thanks!

  • #2
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Hello and welcome!

    I'm confused. There is nothing in your footer for content and no style for the footer that would give any height, coloration, or background image to the otherwise empty <div> element. What is it that you ARE seeing in other browsers? It seems like the footer shouldn't appear anywhere to begin with.

    Do you have a link to a live test page for this?

    P.S. Please edit your original post to wrap [CODE][/CODE] tags around your code block -- it makes things much easier to read.
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. –G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting


  •  

    Posting Permissions

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