Not to style an entire div

Question

If I have a div with a class='myDiv' or something is it then possible to make a not selector in a stylesheet not to style anything inside that div?

In my particular case I'm talking tables, th, tr and td's inside that div.

table:not([class='myDiv'])

thead tr:not([class='myDiv'])

tr:not([class='myDiv'])

td:not([class='myDiv'])

Something similar to that so that the styling in question doesn't affect the elements within the div with that class?

Edit: In my previous questions you can probably see what I am trying to do. The problem is I want to change an external stylesheet (that is used all over the website) in such a way that it still works as it does now for the rest of the website, but should not style my calendar tables.

score 4 · Accepted Answer · answered Oct 05 '15 at 08:44

4

Unfortunately you cannot reference the parent element.
Go the other way around:

.allOtherClasses:not(.specialClassDiv) table{
        /*
        Anything here will style the TABLE elements inside .allOtherClasses
        but not the TABLE inside .specialClassDiv
        */
}

answered Oct 05 '15 at 08:44

Roko C. Buljan

196,159
39
305
313

Great. Looks like we are on the right path. If I have something like table:not([name='start_time']), thead, tbody, th, td, tr { already. How would that look like here when I would need to both avoid my own class and this name? – gerre Oct 05 '15 at 08:54
what means *my own class*? Can you please add more details? it's a bit unclear... – Roko C. Buljan Oct 05 '15 at 08:56
@gerre `table:not([name='start_time']), thead, tbody, th, td, tr {` i think this is completely wrong, cause i.e. the `thead` selector will reference to **every possible `thead`** in your DOM. I'm not sure this is what you want... – Roko C. Buljan Oct 05 '15 at 08:58
I have added a bit to the original post. Hope you can understand it? – gerre Oct 05 '15 at 09:01
@gerre the simplest thing you could do is to put your calendar into a separate .html file, and call it into your page using `` Now your iframe-calendar styles will not get messed up by any stylesheet. – Roko C. Buljan Oct 05 '15 at 09:04
@gerre otherwise, if you want to reset one element's styles to default... will be hard to accomplish, see http://stackoverflow.com/questions/15901030/reset-remove-css-styles-for-element-only - means you'll have to add a `.reset-this` to every possible element inside your parent element... – Roko C. Buljan Oct 05 '15 at 09:09
Ok. I must look into some off these possible solutions. At least I have made some progress with the problem. – gerre Oct 05 '15 at 09:19

Not to style an entire div

1 Answers1