treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Help needed - IE6 problem! (SOLVED) :-)

  • Doing a small project for my course but seem to run into trouble when viewing in IE6, seems to be a white gap between where my header (will eventually be!) and my nav bar. Seems OK in FF and Safari if that helps!

    http://cor02024731.modusinternet.net/karate/karate.html

    @charset \"UTF-8\";
    /* CSS Document */

    /* RESETS PAGE AND BASIC SETUP */



    * {margin: 0; padding: 0;}


    body {font: 62.5% Helvetica, Sans-Serif;
    background-color:#ffffcc;}

    ul {list-style:none inside;}
    p {font-size:1.6em; line-height:1.2em; margin-bottom:1.2em;text-align:justify;}
    p.metadata{background-color:#fff9a7; padding:3px;}

    a {outline:none;}

    a img {border:none;}

    h1 {font-family:Serif;
    color:#a69028;
    font-weight:bold;
    font-size:3.6em;
    font-style:italic;
    }

    #clear {clear:both;}

    /* ENDS BASIC SETUP */

    /*PAGE STRUCTURE */


    #page-wrap {
    width:800px;
    margin:0 auto;
    overflow:hidden;
    background:url(../../images/content-bg.jpg) repeat-y;
    }

    ul#nav li {display:inline;}


    ul#nav li a {display:block;
    height:67px;
    text-indent:-9999px;
    float:left;
    }

    ul#nav li.home a {width:222px;
    background:url(../../images/nav-home.jpg) bottom center no-repeat;
    }

    ul#nav li.courses a {width:172px;
    background:url(../../images/nav-courses.jpg) bottom center no-repeat;
    }

    ul#nav li.training a {width:173px;
    background:url(../../images/nav-training.jpg) bottom center no-repeat;
    }

    ul#nav li.other a {width:233px;
    background:url(../../images/nav-about.jpg) bottom center no-repeat;
    }

    ul#nav li a:hover {background-position:center center;}

    ul#nav li a:active {background-position:center top;}

    #main-content {padding:30px 50px 30px 50px;}

    #footer {min-height:136px;
    background:url(../../images/footer-bg.jpg) no-repeat;
    }

    #article-area {
    width:580px;
    float:left;
    }

    #sidebar {float:right;
    width:72px;
    }

    #sidebar .japanesetext {
    padding:10px 0px 40px 0px;
    }



    /* END PAGE STRUCTURE */


    If anyone can advise me how to fix this id be very grateful!

    Thanks in advance!