Drop style Navigation showing wrong in IE?

Discussion in 'CSS' started by mokimofiki, Feb 18, 2011.

  1. #1
    Here is the code for the nav menu. The menu items come straight down in all browsers besides IE any thoughts would be appriciated.

    CSS
    
    <style>
    #navcon { background: #666666; width: 100%; margin-top:5px; }
    #nav { width: 100%; height: 30px; position: relative; color: #E1A400; font-family: helvetica; margin: 0px auto; font-size: .9em; }
    #nav ul {list-style-type: none; }
    #nav ul li { float: left; position: relative; }
    #nav ul li a { 0px; padding: 9px 10px 9px 10px; display: block; text-align: left; color: #e3c68a; text-decoration: none; }
    #nav ul li a:hover {background: #E1A400; color: #fff; }
    #nav ul li ul { display: none; z-index:9999;}
    #nav ul li:hover ul { margin: 0px; padding: 0px; display: block; position: absolute;z -index:9999;}
    #nav ul li:hover ul li a { background: #777777; color: #fff; display: block; border-right: none; width: 100px;}
    #nav ul li:hover ul li a:hover { background: #E1A400; color: #ffffff; }
    </style>
    
    Code (markup):
    Menu Code
    
    <!-- END DROPDOWN MENU -->
    <div id="navcon">
    <div id="nav">
    <ul>
    <li><a href="#"><b>PACKAGES</b></a>
    <ul>
    <li><a href="../../../Music/Performer-Series-Package">Performer Package</a></li>
    <li><a href="../../../Music/Core-Package">Core Package</a></li>
    </ul>
    </li>
    <li><a href="#"><b>GENRES</b></a>
    <ul>
    <li><a href="../../../Music/Core-Package?x=bodyandsoul">Body & Soul</a></li>
    <li><a href="../../../Music/Core-Package?x=classics">Classics</a></li>
    <li><a href="../../../Music/Core-Package?x=world">World</a></li>
    </ul>
    </li>
    <li><a href="#"><b>VERTICALS</b></a>
    <ul>
    <li><a href="../../../Music/Core-Package?v=retail">Retail</a></li>
    <li><a href="../../../Music/Core-Package?v=hospitality">Hospitality</a></li>
    </ul>
    </li>
    <li><a href="../../../Frequently-Asked-Questions"><b>FAQ</b></a></li>
    <li><a href="../../../Music/Contact-Us"><b>CONTACT MUZAK</b></a></li>
    </ul>
    </div> <!-- nav -->
    </div><!-- navcon -->
    <!-- END DROPDOWN MENU -->
    
    Code (markup):
    Thank you in advance :)
     
    mokimofiki, Feb 18, 2011 IP
  2. mokimofiki

    mokimofiki Well-Known Member

    Messages:
    444
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    130
    #2
    nvmd got it ... there wasen't a defined width on the second ul.
     
    mokimofiki, Feb 18, 2011 IP