Skip to content

Commit

Permalink
Refine description of :not() pseudo-class
Browse files Browse the repository at this point in the history
Replaces commit 6dbaf68.

Co-authored-by: Joshua Chen <sidachen2003@gmail.com>
  • Loading branch information
2 people authored and sideshowbarker committed Jul 26, 2022
1 parent fd88a43 commit 1d0de40
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion files/en-us/web/css/_colon_not/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ There are several unusual effects and outcomes when using `:not()` that you shou
- This pseudo-class can increase the [specificity](/en-US/docs/Web/CSS/Specificity) of a rule. For example, `#foo:not(#bar)` will match the same element as the simpler `#foo`, but has the higher specificity of two `id` selectors.
- The specificity of the `:not()` pseudo-class is replaced by the specificity of the most specific selector in its comma-separated argument of selectors; providing the same specificity as if it had been written [`:not(:is(argument))`](/en-US/docs/Web/CSS/:is).
- `:not(.foo)` will match anything that isn't `.foo`, _including {{HTMLElement("html")}} and {{HTMLElement("body")}}._
- The `:not()` pseudo-class may not work as expected when used with [descendant combinators](/en-US/docs/Web/CSS/Descendant_combinator). For instance, if you do `body :not(table) a`, instead of excluding all the links that are the direct or indirect children of {{HTMLElement("table")}} like you would expect, it excludes only the links that are direct children of {{HTMLElement("table")}}. That means any links you may have inside a {{HTMLElement("tr")}} or {{HTMLElement("td")}} will still be selected.
- This selector will match everything that is "not an X". This may be surprising when used with [descendant combinators](/en-US/docs/Web/CSS/Descendant_combinator), since there are multiple paths to select a target element. For instance, `body :not(table) a` will still apply to links inside a {{HTMLElement("table")}}, since {{HTMLElement("tr")}}, {{HTMLElement("tbody")}}, {{HTMLElement("th")}}, {{HTMLElement("td")}}, {{HTMLElement("caption")}}, etc. can all match the `:not(table)` part of the selector.
- You can negate several selectors at the same time. Example: `:not(.foo, .bar)` is equivalent to `:not(.foo):not(.bar)`.

## Examples
Expand Down

0 comments on commit 1d0de40

Please sign in to comment.