CSS dropdowns in IE - help!!

[jelllyfish]

I'm working in Dreamweaver MX and have created a CSS drop-down navigation
that's working exactly as desired in Safari and Opera, but problematic in IE. I
downloaded the csshover.htc fix and that solved the IE thing except that the
dropdown lists were extending to the edge of the page instead of keeping the
width of their parent navigation items as they do in the other browsers (I
posted on that problem earlier in the general DW section but no luck). Since
then I've uploaded the file for testing and now the dropdowns don't show at all
in IE!! Please please help - this is driving me crazy! The file in question can
be viewed at:

[url]www.webmysteryshoppers.com/New/test.html[/url]

and the relevant css code is:

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #336699;
background-color: #FFFFFF;
behavior:url("csshover.htc");

#nav {
font-size: 90%;
color: #FFFFFF;
font-weight: bold;
padding: 0;
margin: 0;
}

#nav ul {
padding: 0;
margin: 0;
border: 1px solid #003366;
}

#nav li {
float: left;
position: relative;
text-align: left;
list-style-type: none;
}

#nav li ul {
width: 100%;
background-color: #E4DDF1;
}


#nav ul li {
width: 100%;
background-color: #E4DDF1;
}

#nav li>ul {
top: auto;
left: auto;
}

#nav li ul {
display: none;
position: absolute;
top: 100%;
left: 0;
}

#nav li:hover ul {
display: block;
color: #003399;
}


#nav li a {
padding: 0px 14px;
text-decoration: none;
line-height: 15px;
display: block;
}

#nav a:link, #nav a:visited {
color: #FFFFFF;
}
#nav a:hover, #nav a:active {
background-color: #6699FF;
color: #FFFFFF;
}

#nav li ul a:link, #nav li ul a:visited {
color: #003399;
}
#nav li ul a:hover, #nav li ul a:active {
color: #003399;
}

If anyone can help me out that would be really great.
Andie

[Al Sparber- PVII]

Hi Andie,

Make sure the htc file path is correct and that is has been uploaded.
Nice Swap Class menu, btw. Very well done.

--
Al Sparber - PVII
[url]http://www.projectseven.com[/url]
DW Extensions - Menu Systems - Tutorials - CSS FastPacks
---------------------------------------------------------
Webdev Newsgroup: [url]news://forums.projectseven.com/pviiwebdev/[/url]
CSS Newsgroup: [url]news://forums.projectseven.com/css/[/url]
RSS/XML Feeds: [url]http://www.projectseven.com/xml/[/url]




"jelllyfish" <webforumsuser@macromedia.com> wrote in message
news:dj8g7g$l1j$1@forums.macromedia.com...

> I'm working in Dreamweaver MX and have created a CSS drop-down
> navigation
> that's working exactly as desired in Safari and Opera, but problematic
> in IE. I
> downloaded the csshover.htc fix and that solved the IE thing except
> that the
> dropdown lists were extending to the edge of the page instead of
> keeping the
> width of their parent navigation items as they do in the other
> browsers (I
> posted on that problem earlier in the general DW section but no luck).
> Since
> then I've uploaded the file for testing and now the dropdowns don't
> show at all
> in IE!! Please please help - this is driving me crazy! The file in
> question can
> be viewed at:
>
> [url]www.webmysteryshoppers.com/New/test.html[/url]
>
> and the relevant css code is:
>
> body {
> font-family: Arial, Helvetica, sans-serif;
> font-size: 12px;
> color: #336699;
> background-color: #FFFFFF;
> behavior:url("csshover.htc");
>
> #nav {
> font-size: 90%;
> color: #FFFFFF;
> font-weight: bold;
> padding: 0;
> margin: 0;
> }
>
> #nav ul {
> padding: 0;
> margin: 0;
> border: 1px solid #003366;
> }
>
> #nav li {
> float: left;
> position: relative;
> text-align: left;
> list-style-type: none;
> }
>
> #nav li ul {
> width: 100%;
> background-color: #E4DDF1;
> }
>
>
> #nav ul li {
> width: 100%;
> background-color: #E4DDF1;
> }
>
> #nav li>ul {
> top: auto;
> left: auto;
> }
>
> #nav li ul {
> display: none;
> position: absolute;
> top: 100%;
> left: 0;
> }
>
> #nav li:hover ul {
> display: block;
> color: #003399;
> }
>
>
> #nav li a {
> padding: 0px 14px;
> text-decoration: none;
> line-height: 15px;
> display: block;
> }
>
> #nav a:link, #nav a:visited {
> color: #FFFFFF;
> }
> #nav a:hover, #nav a:active {
> background-color: #6699FF;
> color: #FFFFFF;
> }
>
> #nav li ul a:link, #nav li ul a:visited {
> color: #003399;
> }
> #nav li ul a:hover, #nav li ul a:active {
> color: #003399;
> }
>
> If anyone can help me out that would be really great.
> Andie
>