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
    May 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS hover dropdown menu not working in IE6

    Hi having problems fixing a hover dropdown menu in IE6, can
    anybody help.

    See below the html and css. I have tried using JS but haven't managed
    to get it working. Would be very grateful for any advice.

    html

    <div class="template_row" id="menu">

    <ul id="item1">
    <li class="cpanel_link"><a href="index.php">Home</a></li>
    </ul>

    <ul id="item2">
    <li class="cpanel_link"><a href="howwework.php">How we work</a></li>
    </ul>

    <ul id="item3">
    <li class="cpanel_link"><a href="whatwedo.php">What we do</a></li>
    <li class="item"><a href="frameworks.php">Frameworks</a></li>
    </ul>

    <ul id="item4">
    <li class="cpanel_link"><a href="whowework.php">Who we work with</a></li>
    <li class="item"><a href="wherewework.php">Where we work</a></li>
    </ul>
    <ul id="item4">
    <li class="cpanel_link"><a href="howwethink.php">How we think</a></li>
    <li class="item"><a href="learnings.php">Learnings</a></li>
    </ul>
    <ul id="item4">
    <li class="cpanel_link"><a href="whoweare.php">Who we are</a></li>
    <li class="item"><a href="joinus.php">Join us</a></li>
    </ul>
    <ul id="item4">
    <li class="cpanel_link"><a href="contactus.php">Contact us</a></li>
    </ul>
    </div>


    css
    #menu{
    position:relative;
    margin-top:0px;
    left: 0px;
    top: 0px;
    background-color: #0B51A2;
    }
    #menu ul .item{display:none;}
    #menu ul:hover .item{
    display:block;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    background-color: #63BEEB;
    text-align: center;
    font-weight: normal;
    }
    #menu ul:hover .item a{color:#fff;text-decoration:none;}
    #menu ul:hover .item a:hover{
    color:#999;
    }

    #menu ul{
    width:165px;
    float:left;
    margin:0px;
    padding:0px;
    list-style:none;
    background-color: #0B51A2;
    height: 20px;
    vertical-align: middle;
    }
    .clear{
    clear:both;
    height:10px;
    }
    a{
    text-decoration:none;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    color:#FFF;
    }
    a:hover { text-decoration:underline; }

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,861
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    http://htmldog.com/articles/suckerfish/dropdowns/ is a good resource to learn the making of a drop down.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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