You can use the :not()
pseudo-class, but IE8 does not support it:
.this-class:not(table), .this-class .something-else {
border: 1px solid red;
}
Thankfully, getting it to work for IE8 is trivial — simply apply the style to any elements with .this-class
, and override it for the ones that are tables instead:
.this-class, .this-class .something-else {
border: 1px solid red;
}
table.this-class {
border: none;
}
Notice that the .this-class .something-else
part of your first rule remains completely separate, matching descendants of .this-class
regardless of what type of element it is. If that is intended, you can leave that portion unchanged. Otherwise, if you want the styles to apply to descendants of .this-class
with the same condition, you will need to repeat the condition accordingly.
Using :not()
:
.this-class:not(table), .this-class:not(table) .something-else {
border: 1px solid red;
}
And using an override (for IE8):
.this-class, .this-class .something-else {
border: 1px solid red;
}
table.this-class, table.this-class .something-else {
border: none;
}
:not(table)
should work.:not()
will not work in IE8 or lower, if older IE browser compatibility is a concern.