First let me thank you in advance for any help you can provide. I have a
left hand navigation (nav) menu in a div tag. The menu has a few links that
are actually javascript that display hidden submenu links. The code will be
below.
This error is happening in IE only - when you click on a link that displays
hidden submenu links, it makes the entire nav bar wider. I have tried to
troubleshoot with no luck so far so I humbly come to you for help.
Here's a code snippet that is already within a <ultag:
HTML Code:
<li><a href="#" onclick="javascript:showElement('menu1')">Start
Here</a></li>
<li id="menu1" style="display:none">
<ul>
<li style="width: 100px;"><a href="menu1.php">Menu 1</a></li>
<li><a href="register.php">Register</a></li>
<li><a href="termsofuse.php">Terms</a></li>
</ul>
</li>
Here is the firebug readout of that element:
..nav li
border-bottom:1px solid #90BADE;
width:200px;
}
Inherited fromul.nav
..nav
color:#22C3FF;
font-size:0.8em;
list-style-type:none;
text-decoration:none;
}
Inherited fromdiv#leftMenu
#leftMenu
font-family:Verdana,Arial,Helvetica,sans-serif;
}
As I said, when you click on "Start Here", it calls a javascript that
changes <li id="menu1"to be visible. That works fine. But the error is
that the submenu, in fact all the menu items are wider than before you
clicked on "Start Here." When you click "Start Here" again, the submenu
disappears and the width goes back to what was intended.
Please let me know if you need anything else to help diagnose.
Many thanks for your help!