Hi,
weird issue that I haven't seen before and I'm wondering if anyone knows a
quick workaround.
Basically, I have two navigation bits:
<div id="subnav">
<ul>
<li><a href="#" class="subnavoption on" id="subnavoverview"><span>Item
1</span></a></li>
<li><a href="#" class="subnavoption" id="subnavdrills"><span>Item
2</span></a></li>
</ul>
</div>
and
<div id="subcontenttabs">
<ul>
<li><a href="#" class="taboption" id="tabstats"><span>Sub 1</span></a></li>
<li><a href="#" class="tabcurrent" id="tabtalk"><span>Sub 2</span></a></li>
</ul>
The main nav works fine. I assign it a background image for its regular state,
and a different one for when the "on" class is also assigned (current page,
basically).
With the subnav I'm doing it a little differently, instead of appending a "on"
class, I just either set it to "tabcurrent" or "taboption" (off) and feed it a
different BG image based on that. In Firefox it works exactly like it should.
In IE 6, it does not.
#subcontenttabs ul li a#tabstats.taboption{ background:
url(../img/Baseball/tabs/stats_off.gif); }
#subcontenttabs ul li a#tabstats.tabcurrent {background:
url(../img/Baseball/tabs/stats_on.gif); }
#subcontenttabs ul li a#tabtalk.taboption {background:
url(../img/Baseball/tabs/kidtalk_off.gif); }
#subcontenttabs ul li a#tabtalk.tabcurrent { background:
url(../img/Baseball/tabs/kidtalk_on.gif); }
Basically, what IE does is it ignores the "tabcurrent" declaration. It seems to
be based on what order I declare them in my css file. If I switch the two
options to be like this:
#subcontenttabs ul li a#tabstats.tabcurrent {background:
url(../img/Baseball/tabs/stats_on.gif); }
#subcontenttabs ul li a#tabstats.taboption{ background:
url(../img/Baseball/tabs/stats_off.gif); }
then I get the tabcurrent, but I don't get taboption. ?
To make things more confusing, If I take that declaration outside of the css
file and I put it after the @import in the head of that HTML document, then it
works.
What is going on?
Sorry for the length, but this is really stumping me. Am I doing something
wrong or is IE totally wonky on this? I've seen a lot of IE bugs before, but
never this one.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
