How to Create a CSS Rule for All Elements Except One Class

How to create a css rule for all elements except one class?

The negation pseudo-class seems to be what you are looking for.

table:not(.dojoxGrid) {color:red;}

It's not supported by ≤ IE8 though.

Create a css rule for all elements except one class?

If you use display property it will affect both parent and its children, but you can use visibility property to achieve your goal. (I added some text to .posted-in span to show the result better)

.portfolio-descr{  visibility:hidden;}
.portfolio-descr>*{  visibility:visible;}

<div class="portfolio-descr">        <span class="posted-in">abc</span>                                     <h3><a href="">Name</a></h3>                   Some text</div>

Apply CSS Style on all elements except with a SPECIFIC ID

Use the :not selector:

div:not(#bar){    color:red;}

<div>foo</div><div id="bar">bar</div>

Selecting everything except one element

Correct the syntax (add ":" in front of "not"):

.container :not(.test2) {  color: red;}

<div class='container'><p class='test'>test</p><p class='test'>test</p><p class='test'>test</p><p class='test'>test</p><p class='test2'>test 2</p></div>

Apply css to all element except one who has specific parent

Try this code

div:not(.sidebar) ul.group li {  border: 1px solid red;}// Here i have used div, but you can use whatever tag you have used for sidebar

<body class="page">
  <div class="sidebar">    <ul class="group">      <li>1</li>      <li>2</li>      <li>3</li>    </ul>  </div>    <div class="page-section">    <ul class="group">      <li>1</li>      <li>2</li>      <li>3</li>    </ul>  </div>  </body>

Apply CSS to any element except for certain class descendants?

You will not be able to exclude descendants this way without writing a separate selector. You won't be able to do this even using :not(), for the reasons stated here.

Fortunately, the fact that .light elements will only ever occur within the context of a .dark element and not vice versa makes this a little easier. Since you have a body CSS rule already, just add .light p to that rule, and move the entire ruleset underneath .dark p so .light p will take precedence:

.dark p {
    color: #000;
}

body, .light p {
    color: #ccc;
}

Updated fiddle

Alternatively if you want to keep the body rule on top, you could bump up the specificity of .light p to ensure it will take precedence:

body, body .light p {
    color: #ccc;
}

.dark p {
    color: #000;
}

Apply style to all elements except for a specific selector and its children

Use ">" the child combinator:

.orange {
  > :not(.list){
    color: orange
  }
}

This selects all children of .orange that do not have the .list class.

Apply style to all divs except one specific

Just apply the rule to all divs first:

#toolbar div {
   float: left;
   background-repeat: no-repeat;
   margin: 2px 12px 2px 12px;
}

Then you need to zero the values out for the specific case:

#toolbar div.olControlNavigationHistor {
   float: none;
   background-repeat: repeat;
   margin: 0;
}

Of course this assumes that the property values that specific div would have had without the first rule applied are each properties defaults (such as margin: 0 and float: none.)

EDIT:
However in the future when CSS3 is supported everywere, you could also just rewrite your original rule as #toolbar div:not(.olControlNavigationHistory) and it would work correctly and elegantly.

Exclude a class from all of the selectors in CSS

It is possible with CSS4 :is selector. You can watch out for the browser support here: https://caniuse.com/?search=is but in modern web developer terms, you are safe to use it.

:is(h1,h2,h3):not(.exclude) {
  background: #bada55;
  color: #565656;
  padding: 10px;
}

<h1 class="exclude">
  Excluded
</h1>
<h2 class="include">
  Included
</h2>
<h3 class="exclude">
  Excluded
</h3>

How to Create a CSS Rule for All Elements Except One Class