Sent by Bob Easton on 30 October 2004 11:11
Marty Martin wrote:
> I have two classes, one is called .leftsidebar the other is called .clear.
>
> .leftsidebar {
> background-image: url(blah.gif);
> background-color: #CCC;
> }
>
> .clear {
> background-image: none
> background-color: transparent;
> }
>
> Now, I am using some dynamic scripting that allows a user to determine
> if the sidebar should be the default --
>
> <div class="leftsidebar">
>
> or if it should be blank, wherein the scripting would automatically
> insert .clear as below--
>
> <div class="leftsidebar clear">
>
> Now, the leftsidebar style has widths and other things applied to it
> that I want to carry over to .clear, but I want .clear to override the
> background settings. ...
> The above example does work fine in Mozilla, but not in IE. ...
>
> Is this a known IE bug rendering styles or am I doing something wrong?
>
> Thanks!
>
*IF* the class declarations were copied and pasted in, then I would add
a semicolon after none. If that's just a typo...
This is an issue of specificity. The general rule is that classes
applied lasts, and more specifically, overrule those defined before. In
this case clear is applied last, but is not more specific than
leftsidebar. So, I think IE is simply ignoring the "last" aspect while
Mozilla is respecting it.
You can try making clear more specific for IE by setting !important.
..clear {
background-image: none !important;
background-color: transparent !important;
}
--
Bob Easton
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/