...

View Full Version : Navcontainer issue



tricky76
08-03-2007, 05:33 PM
Hi,

I have this Page (http://ds-redesign.myzen.co.uk/worklife/localauthorities.html) working fine in all browsers using the navcontainer CSS - however when I use "current" to highlight a sub menu option in IE it uses the main image. In all other browsers it is correct. It should be the pale green background image as used when you hover over the sub menus.

Also if anyone can tell me how to get rid of that silly gap on the right I'd be even more appreciative.

CSS here (http://ds-redesign.myzen.co.uk/worklife/CSS/worklife_main.css)

koyama
08-05-2007, 03:59 AM
I have this Page (http://ds-redesign.myzen.co.uk/worklife/localauthorities.html) working fine in all browsers using the navcontainer CSS - however when I use "current" to highlight a sub menu option in IE it uses the main image. In all other browsers it is correct. It should be the pale green background image as used when you hover over the sub menus.
Hmm... Did you invent your own l2 tags?


<div id="navcontainer">
<ul>
<li><a href="#">Home page</a></li>
<li><a href="#">What's new</a></li>
<li><a href="#">About us</a></li>
<li><a href="SubMain_who.html" target="_top" id="current">Who we work with</a></li>

<div id="navcontainersub">
<l2><a href="#">Schools</a></l2>
<l2><a href="localauthorities.html" target="_top" id="currentsub">Local Authorities</a></l2>
<l2><a href="#">Charities</a></l2>
</div>
<li><a href="SubMain_services.html" target="_top">Our services</a></li>
<div id="navcontainersub">

<l2><a href="#">Well-Being</a></l2>
<l2><a href="#">EAP</a></l2>
<l2><a href="#">Headspace</a></l2>
<l2><a href="#">Training &amp; development</a></l2>
</div>
While it seems that in at least Firefox 2 and Opera 9 you can style such custom elements using the selector l2 {...} then this is not the case in IE6 and IE7. This is why your selectors are not working in IE:


#navcontainersub l2 a#currentsub {
background: url(../images/nav_sub_hover.gif);
color:#666666;
font: 11px Trebuchet MS,verdana, arial, sans serif;
text-indent: 30px;
}

Besides that your document does not validate when you insert such custom elements. Instead, I suggest that you use ordinary li elements.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum