HELP!!!! CSS Menu problem in IE6 only

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • tonsi
    New Member
    • May 2007
    • 4

    HELP!!!! CSS Menu problem in IE6 only

    I have a css menu that works great in IE7 and other browser but when you check it in IE 6 it only shows the first dropdown. I am not that great at css but ANY help would be greatly appreciated.

    here is the site I am having trouble with.



    here is the navigation css:

    .moveover {
    text-align: left;
    margin-left: 8px;
    font-size: 11px;
    color: #000000;
    display: block;
    overflow: visible;
    }
    .moveover2 {
    text-indent: 1px;
    padding-left: 1px;
    font-size: 11px;
    color: #000000;
    display: block;
    }

    .moveNav {

    margin-left: 180px;
    padding-left: 180px;
    }
    #pageTag {
    width: 600px;
    height: 27px;
    margin: 155px 0px 0px 20px;
    position: absolute;
    z-index: 26;



    }


    #navholder {
    width: 483px;
    height: 27px;
    margin: 10px 0px 0px 0px;
    position: absolute;
    z-index: 45;
    clear: both;
    }




    a {
    text-decoration: none;
    color: #000000;
    }

    #nocss {
    display: none;
    }

    #OldSchool {
    z-index: 1;
    }

    .label {
    display: none;
    }



    /* START - Nav 1 */

    /* Float nav and set basic properties - in this case the id and block element are the same and so are combined */
    #nav, #nav ul {
    float: left;
    width: 160px;
    display: block;
    height: 27px;
    list-style: none;
    line-height: .85;
    font-weight: bold;
    padding: 0;
    margin: 0;
    color: #FFFFFF;
    font:Arial, Helvetica, sans-serif;
    font-size: 11px;
    }

    /* Control style and placement of links as well as dropdown block */
    #nav a {
    display: block;
    width: 160px;
    w\idth: 160px;
    height: 26px;
    font-size: 11px;
    font-weight: normal;
    text-decoration: none;
    padding: 0;
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-decoration: none;
    font-style: normal;
    font-weight: normal;

    }



    #nav a:hover {


    }



    /* Set properties of top element */
    #nav li {
    float: left;
    padding: 0;
    width: 140px;
    height: 26px;
    background-color: #f78221;


    }



    /* Position the menu off screen rather than display: none; */
    #nav li ul {
    position: absolute;
    left: -999em;
    /*height: auto;*/
    width: 170px;
    w\idth: 170px;
    font-weight: normal;
    margin: 0;



    }

    /* Set properties of dropdown cells - width will affect non mouse-over in IE */
    #nav li li {
    background: #808080;
    margin: 0;
    padding: 0;
    height: 27px;
    line-height: 30px;
    width: 160px;
    text-indent: 9px;
    padding-top: 3px;

    }


    #nav li ul a {
    height: 20px;
    width: 140px;
    w\idth: 140px;
    padding: 0;
    display: block;

    }


    #nav li ul a:hover {
    height: 20px;
    width: 140px;
    w\idth: 140px;
    padding: 0;
    color: #000000;
    display: block;

    }



    /* third-and-above-level lists */
    #nav li ul ul {
    margin: -19px 0 0 131px;
    }

    /* Move menu back on page on mouse over */
    #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
    left: -999em;

    }

    #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
    left: auto;

    }

    /* Control Background of Top Mouse Over */
    #nav li:hover, #nav li.sfhover {
    background-color: #f78221;

    }

    /* Control Background of Drop Down Mouse Over */
    #nav li li:hover, #nav li li.sfhover {
    background: #f78221;


    }
    #nav li:hover, #nav li.hover {
    position: static;
    }

    /* END - Nav 1 */
  • drhowarddrfine
    Recognized Expert Expert
    • Sep 2006
    • 7434

    #2
    Validate and fix your html and css errors and see if that makes the problem go away.

    Comment

    • tonsi
      New Member
      • May 2007
      • 4

      #3
      Originally posted by drhowarddrfine
      Validate and fix your html and css errors and see if that makes the problem go away.
      OK...so I have validated the HTML/CSS and fixed the errors that were reported. But I am still having the same proble. Only in IE6. I figured it may be a "hover" issue but I don't know where.

      Comment

      • tonsi
        New Member
        • May 2007
        • 4

        #4
        problem fixed. It was the repaeteing of the id. Thanks so much

        Comment

        • drhowarddrfine
          Recognized Expert Expert
          • Sep 2006
          • 7434

          #5
          Originally posted by tonsi
          problem fixed. It was the repaeteing of the id. Thanks so much
          Yes, it was one of the reported errors in the validator. Another shining example of why everyone should validate both html and css and correct their errors before asking questions about why things don't work.

          Comment

          Working...