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 9 of 9
  1. #1
    New Coder
    Join Date
    Apr 2009
    Posts
    51
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Horizontal CSS Menu Not Displaying in IE

    Hello. I am having some trouble with my top CSS navigation on the following link: http://menofcompassion.cmcconnell.com/

    It shows up fine in Firefox, Safari and Chrome, but not in Internet Explorer (where it doesn't even appear). Any help would be awesome. Here is the CSS:

    @charset "utf-8";
    body {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 14px;
    margin: 0px;
    padding: 0px;
    background-image: url(http://menofcompassion.cmcconnell.co...g_square.png);
    background-repeat: repeat;
    color: #908170;
    }
    h1, h2, h3 {
    margin-top: 0px;
    margin-bottom: 5px;
    color: #003c66;
    }
    p {
    margin-top: 0px;
    margin-bottom: 15px;
    }
    a:link, a:visited {
    color: #003c66;
    text-decoration: none;
    }
    a:hover, a:active {
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #598e6c;
    color: #598e6c;
    }
    #content_container {
    width: 900px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 20px;
    padding-bottom: 20px;
    }
    #content_white_bg {
    }
    #content_white_bg_clear {
    clear: both;
    }
    #content_white_bg_top {
    background-image: url(http://menofcompassion.cmcconnell.co..._top_bar.png);
    height: 28px;
    }
    #content_white_bg_middle {
    background-color: #FFFFFF;
    padding-top: 20px;
    padding-bottom: 20px;
    }
    #actual_content_container {
    width: 860px;
    margin-right: auto;
    margin-left: auto;
    }
    #actual_content_container_clear {
    clear: both;
    }
    #2_cols {
    background-image: url(http://menofcompassion.cmcconnell.co...ert_line.png);
    background-repeat: repeat-y;
    width: 860px;
    margin-right: auto;
    margin-left: auto;
    }
    #2_cols_clear {
    clear: both;
    }
    #left_col {
    float: left;
    width: 570px;
    }
    #right_col {
    float: right;
    width: 210px;
    font-family: Arial, Helvetica, sans-serif;
    color: #003c66;
    font-size: 12px;
    padding: 20px;
    border: 1px solid #e3e3e3;
    }
    #content_white_bg_bottom {
    background-image: url(http://menofcompassion.cmcconnell.co...hite_bar.png);
    height: 20px;
    }
    #wrapper {
    }
    #nav_container {
    background-image: url(http://menofcompassion.cmcconnell.co...p_nav_bg.png);
    background-repeat: repeat-x;
    height: 50px;
    }
    #nav {
    padding: 0px;
    list-style-type: none;
    width: 500px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    }
    #nav li {
    float: left;
    }
    #nav li a:link, #nav li a:visited {
    color: #FFFFFF;
    text-align: center;
    display: block;
    width: 100px;
    line-height: 49px;
    font-size: 16px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    }
    #nav li a:hover, #nav li a:active {
    background-color: #598e6c;
    background-image: url(http://menofcompassion.cmcconnell.co...av_bg_up.png);
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    }
    #logo_area {
    background-image: url(http://menofcompassion.cmcconnell.co..._area_bg.png);
    background-repeat: repeat-x;
    height: 200px;
    }
    #logo {
    height: 200px;
    width: 380px;
    margin-right: auto;
    margin-left: auto;
    }
    #content_background {
    background-color: #003c66;
    }
    #footer_top_shadow {
    background-image: url(http://menofcompassion.cmcconnell.co...hadow_bg.png);
    background-repeat: repeat-x;
    height: 20px;
    clear: both;
    }
    #footer {
    background-image: url(http://menofcompassion.cmcconnell.co...r_tan_bg.png);
    background-repeat: repeat-x;
    height: 91px;
    clear: both;
    color: #FFFFFF;
    }
    #footer a:link, #footer a:visited {
    color: #FFFFFF;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    }
    #footer a:hover, #footer a:active {
    color: #FFFFFF;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #FFFFFF;
    }
    #footer_links_container {
    padding-top: 20px;
    width: 860px;
    margin-right: auto;
    margin-left: auto;
    }
    #footer_links_container_clear {
    clear: both;
    }
    #footer_links_left {
    float: left;
    width: 570px;
    }
    #footer_links_right {
    float: right;
    width: 250px;
    text-align: right;
    }

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    Start with fixing the errors in your markup, see http://validator.w3.org/check?uri=ht...Inline&group=0
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    cmcconnell (04-21-2009)

  • #3
    New Coder
    Join Date
    Apr 2009
    Posts
    51
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Now What

    This probably sounds stupid, but I followed the link you sent and I am not sure what to do to fix the validation - for instance:

    Line 22, Column 137

    What exactly is it that I need to add?

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    Code:
    <ul id="nav">
                <li><a href="#"><a href="/index.html">Home</a></a></li>
    Giving some proper indents would have helped you to locate such errors.

    http://infohound.net/tidy/ is a good tool (I haven't used it, but looks good ).
    Last edited by abduraooft; 04-21-2009 at 05:35 PM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    New Coder
    Join Date
    Apr 2009
    Posts
    51
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Ok

    So you think if I go through these errors that it will then render the menu correctly in IE?

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    Quote Originally Posted by cmcconnell View Post
    So you think if I go through these errors that it will then render the menu correctly in IE?
    I can't assure, but let's at least conclude that the misbehavior is not due to the errors in your markup, which will help us to locate the cause of actual errors, if any
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #7
    New Coder
    Join Date
    Apr 2009
    Posts
    51
    Thanks
    5
    Thanked 0 Times in 0 Posts
    I got rid of the extra tags within the #nav area, so that is 5 errors gone. I am using a content management system called Business Catalyst that makes it hard to fix the other errors. But I am still getting that problem in IE - and now, the white box for the main content is not working in FF???

  • #8
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    But I am still getting that problem in IE - and now, the white box for the main content is not working in FF???
    I couldn't see any such issues (tested in FF2,IE6, IE7)
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #9
    New Coder
    Join Date
    Apr 2009
    Posts
    51
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Yep, I finally got it figured out - thanks for your help, I appreciate it.


  •  

    Tags for this Thread

    Posting Permissions

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