By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,494 Members | 1,957 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,494 IT Pros & Developers. It's quick & easy.

horizontal submenu not displaying in IE

P: n/a
Code is below. Works in Firefox but not IE. I understand there is a box
issue with IE but I am having problems fixing this.

Many thanks for any help!

#navigation {
float: left;
width: 125px;
padding: 0;
}
#navigation ul {
margin: 0;
list-style: none;
margin-top: 2px;
padding: 0;
}
#navigation li {
width: 125px;
border-bottom: 1px solid #722100;
}
#navigation a:link, #navigation a:visited {
display: block;
padding: 5px 5px 5px 0.5em;
color: #FFFFFF;
text-decoration: none;
height: 100%;
}
#navigation a:hover {
background-color: #9c20da;
color: #FFFFFF;
}
#navigation li {
position: relative;
}
#navigation ul ul {
position: absolute;
top: 0;
left: 100%;
width: 100%;
}
div#navigation ul ul,
div#navigation ul li:hover ul ul{
display: none;
background-image: url(bg.gif);
background-repeat: repeat-y;
background-position: left top;
}
div#navigation ul li:hover ul,
div#navigation ul ul li:hover ul{
display: block;
}
.....
<div id="navigation">
<ul>
<li><a href="/">Home</a></li>
<li><a href="#">Links</a>
<ul>
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
</ul>

</li>
<li><a href="#">Link3</a></li>
</ul>
</div>
Jan 23 '07 #1
Share this Question
Share on Google+
1 Reply


P: n/a
Hi Paul

I am not sure what is not working exactly, but here my thoughts...

1) If you make menu for IE6, you should not use 'li:hover' - user
a:hover instead.
2) If you have issues with IE box model switch to W3C box model:
http://www.456bereastreet.com/archiv..._css_box_model
http://msdn.microsoft.com/workshop/a...ts/doctype.asp

- Alex.

Jan 23 '07 #2

This discussion thread is closed

Replies have been disabled for this discussion.