Hi,
I am trying to make the opposite of a drop-down menu: a rise-up menu.
My code below works in all browsers except IE.
How can I make my code,that type of menu, work in IE?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>50252</title>
<style type="text/css">
#menu
{
margin-top:10em;
}
#menu > li
{
position:relative;
}
#menu ul
{
display:none;
position:absolute;
bottom:1em;
}
#menu > li:hover > ul
{
display:block;
}
</style>
</head>
<body>
<ul id="menu">
<li>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home</a>
<ul>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
</ul>
</li>
</ul>
</body>
</html>
jbonhamWell, IE (being a bit on the crap side) doesn't understand this : #menu > li:hover > ul
You don't neeed the '>'. You can take that out.
IE only understands :hover on the 'a' tag. To make it understand it in other places, you can use an .htc file. Here's an example. (<!-- m --><a class="postlink" href="http://bonrouge.com/br.php?page=dmenu">http://bonrouge.com/br.php?page=dmenu</a><!-- m -->) .
I hope this helps.
I am trying to make the opposite of a drop-down menu: a rise-up menu.
My code below works in all browsers except IE.
How can I make my code,that type of menu, work in IE?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>50252</title>
<style type="text/css">
#menu
{
margin-top:10em;
}
#menu > li
{
position:relative;
}
#menu ul
{
display:none;
position:absolute;
bottom:1em;
}
#menu > li:hover > ul
{
display:block;
}
</style>
</head>
<body>
<ul id="menu">
<li>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home</a>
<ul>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"">Home submenu</a></li>
</ul>
</li>
</ul>
</body>
</html>
jbonhamWell, IE (being a bit on the crap side) doesn't understand this : #menu > li:hover > ul
You don't neeed the '>'. You can take that out.
IE only understands :hover on the 'a' tag. To make it understand it in other places, you can use an .htc file. Here's an example. (<!-- m --><a class="postlink" href="http://bonrouge.com/br.php?page=dmenu">http://bonrouge.com/br.php?page=dmenu</a><!-- m -->) .
I hope this helps.