I’m new to these forums and have done my fair share of googling and searching forums but have been unable to figure out what I am doing wrong.
check [url]http://www.austinscott.name/DayandGryder.com
click on “our firm” notice how this only works in firefox.
I’ve tried searching this website for another menu that has the same functionailty but have been unable to find it. [url]http://www.cssplay.co.uk/menus/index.html
Does anyone know how to make this menu work in IE? It seems very simple with just a css hide and show function but it still doesn’t work at all in IE. Does anyone see anything wrong with my DIV around the submenu? It seems to be where the problem lies.
code for menu:
[code]
<ul class=”avmenu”>
<li><a href=”index.html”>Home</a></li>
<li><a class=”menu1″ onclick=”showHide(‘mymenu1’)” href=”#”>Our Team</a>
<div id=”mymenu1″ class=”hide”>
<li><a href=”JeffDay.html” class=”submenu”>Jeff</a></li>
<li><a href=”#” class=”submenu”>Phil</a></li>
<li><a href=”#” class=”submenu”>Austin</a></li></div>
<li><a href=”thefirm.html”>The Firm</a></li>
<li><a href=”resources.html”>Resources</a></li>
</ul>
</div>
relevant css:
[code]
/***** Main menu *****/
ul.avmenu {
width:140px;
margin:0 0 18px;
padding:0;
list-style:none;
}
ul.avmenu li {
width:140px;
padding:0;
line-height:1.4em;
display:inline;
}
ul.avmenu li a {
background-color:#f4f4f4;
color:#505050;
font-weight:bold;
width:130px;
float:left;
margin-bottom:5px;
padding:5px 1px 5px 5px;
border-left:4px solid #cccccc;
text-decoration:none;
}
ul.avmenu li a:hover,ul.avmenu li a.current {
background-color:#eaeaea;
border-left:4px solid #286ea0;
color:#505050;
}
ul.avmenu ul {
margin:0 0 0 15px;
padding:0 0 5px 0;
font-size:0.9em;
width:125px;
}
ul.avmenu ul a {
padding:3px 1px 3px 5px;
width:115px;
}
ul.avmenu ul ul {
width:113px;
}
ul.avmenu ul ul a {
width:100px;
}
/* Sub-menu stuff */
.submenu{
display: block;
height: 19px;
margin-left: 5px;
padding-top: 2px;
padding-left: 7px;
background-color: #3F4C6B;
}
.menu1{
background-color:#f4f4f4;
color:#505050;
font-weight:bold;
width:130px;
float:left;
margin-bottom:5px;
padding:5px 1px 5px 5px;
border-left:4px solid #cccccc;
text-decoration:none;
}