Email conversation
| From | Josh Kotecha |
|---|
| To | Me |
|---|
| Subject | Horizontal CSS menu with IEmem.htc |
|---|
| Date | 20 September 2006 04:36 |
|---|
Hi Tarquin,
I have been playing around with a script to do horizonal CSS menu.
It sort of works in a compliant browser but fails in IE.
Have I attached the IEmem.htc file correctly?
Thanks,
Josh
============================= Here is the File ===================
<html>
<head>
<style>
ul.makemenu {text-decoration: none; list-style: none; display: inline;}
li ul.makemenu {display: none}
li:hover > ul.makemenu {display: block; margin-left: -30px; background-color: green;}
</style>
<!--[if gte IE 5]><![if lt IE 7]>
<style type="text/css">
/* that IE 5+ conditional comment makes this only visible in IE 5+ */
ul.makeMenu li { /* the behaviour to mimic the li:hover rules in IE 5+ */
behavior: url( IEmen.htc );
}
ul.makeMenu ul { /* copy of above declaration without the > selector */
display: none; position: absolute; top: 2px; left: 78px;
}
</style>
<![endif]><![endif]-->
</head>
<body>
<ul class="makemenu">
<li style="float: left">hello world
<ul class="makemenu">
<li><a href="Newshttp://www.yahoo.com">News</a></li>
<li>Weather</li>
</ul>
</li>
<li style="float: left; margin-left: 50px;">Bye World
<ul class="makemenu">
<li><a href="Newshttp://www.yahoo.com">News</a></li>
<li>Weather</li>
</ul>
</body>
</html>
| From | Me |
|---|
| To | Josh Kotecha |
|---|
| Subject | Re: Horizontal CSS menu with IEmem.htc |
|---|
| Date | 23 September 2006 13:26 |
|---|
Josh,
> Have I attached the IEmem.htc file correctly?
Yes. Assuming you rewrite the htc file and the styles inside the conditional
comments to work with your new layout (remember that IE does not use the
same styles as the other browsers).
However, as I said, I never got my menus to work properly horizontally. You
are better off looking at other people's menus, as many have had more
success then me.
Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/