Sub menu not showing up in IE

My Sub menu is not showing up in IE

I've looked at some previous entries regarding this and have tried giving the ID

ul#cssmw4 ul.level-2 > li > a, ul#cssmw4 ul.level-2 > li > a:link

height and width and still get no results

need help here is a test link

index-2.php

Thanks!

Just incase here is the html and css




ul#cssmw4 ul.level-2 {
left: 101px; height:30px;width: 130px;
}
ul#cssmw4 ul.level-2 > li {
background-image: none; height:30px;width: 130px;
}
ul#cssmw4 ul.level-2 > li > a, ul#cssmw4 ul.level-2 > li > a:link {
background-image: url("../cssmw4_images/menu_bg.png");
background-position: center center;
border-bottom: solid 1px #fff;
border-right: solid 1px #fff;
color: #FFFFFF;
display: block;
font-family: "Trebuchet MS", Helvetica, sans-serif;
font-size: 16px;
font-style: normal;
font-weight: normal;
margin: 0 0 0 0;
padding: 0px 0px 0px 0px;
text-decoration: none;
text-transform: uppercase;
width: 130px;
outline-style: none;
z-index: 555;
background-color:#F00;
height:30px;
}
ul#cssmw4 ul.level-2 > li > a:active, ul#cssmw4 ul.level-2 > li > a:focus {
background-color: #CBD74C;
background-position: center;
color: #FFFFFF;
font-weight: normal;
text-decoration: none;
outline-style: none;
width: 130px;
height:30px;
}
ul#cssmw4 ul.level-2 > li:hover > a, ul#cssmw4 ul.level-2 > li:hover > a:link {
background-color: #CBD74C;
background-image: url("../cssmw4_images/menu_bg.png");
background-position: center;
color: #FFFFFF;
font-weight: normal;
text-decoration: none;
outline-style: none;
width: 130px;
height:30px;
}

ul#cssmw4 ul.level-2 > li.hover > a, ul#cssmw4 ul.level-2 > li.hover > a:link {
background-color: #CBD74C;
background-image: url("../cssmw4_images/menu_bg.png");
background-position: center;
color: #FFFFFF;
font-weight: normal;
text-decoration: none;
outline-style: none;
width: 130px;
height:30px;
}

ul#cssmw4 ul.level-2 > li.current > a.current, ul#cssmw4 ul.level-2 > li.current > a.current:link {
background-color: #CBD74C;
background-image: url("../cssmw4_images/menu_bg.png");
background-position: center;
color: #FFFFFF;
font-weight: normal;
text-decoration: none;
outline-style: none;
height:30px;
width:130px;
}



<ul class="level-0" id="cssmw4">
<li class="parent" ><a href="index.htm"><img src="images-gables/menu_gables_logo_topleft.png" width="122" height="40" border="0" /></a>
<ul class="level-1">
<li><a href="index.htm">Home</a></li>
<li class="parent"><a href="aboutus.php">About us</a>
<ul class="level-2">
<li><a href="boardofdirectors.php">Board Of Directors</a></li>
<li><a href="staff_directory.php">Staff Directory</a></li>
</ul>
</li>
<li><a href="contact.php">Contacts</a></li>
</ul>
</li>
<li class="parent" ></li>
<li style="margin-top:20px;" ><a href="filmsandprograms.php">Films & Programs </a></li>
<li style="margin-top:20px;" class="parent"><a href="membership_and_donations.php">Buy &amp; Donate</a>
<ul class="level-1">
<li><a href="membership_and_donations.php">Introduction</a></li>
<li ><a href="membership_levels.php">Memberships & Donation</a></li>
<li><a href="membership_purchase.php">Order Online</a></li>
</ul>
</li>
<li style="margin-top:20px;" ><a href="services.php">Rentals & Services</a></li>
<li style="margin-top:20px;"><a href="news_listings.php">News</a></li>
<li style="margin-top:20px;" class="parent"><a href="gallery.php">Sponsors</a>
<ul class="level-1">
<li><a href="founding_sponsors.php">Founding Sponsors</a></li>
<li><a href="corp_sponsors.php">Corporate Sponsors</a></li>
</ul>
</li>
<li style="margin-top:20px;"><a href="gallery.php">Gallery</a></li>
</ul>

I can see the submenues fine using IE 9 and ie 8 compatibility mode.

the margin settings on the top are causing the submenu to disappear before you can click them though.

Im using Ie 8.0 in compatibility mode as well..

About seeing the sub menu and it disappearing the funny thing is i dont have any margin on top or bottom of these items nor padding.

Also What can i do to to be able to view this on IE i have no luck with any changes i've made.

dont try editing the code by hand to add height and width to the elements, instead edit the menu using CSS Menu Writer to add the height and width attributes. IE is still reading the auto attribute for width and is not even seeing a height. IE cannot work properly with auto heights and widths.