iheredia on Show HN: CSS Speedrun – A small game to test and improve your CSS knowledge

Comment on Show HN: CSS Speedrun – A small game to test and improve your CSS knowledge

* Spoiler *

The use of `:not` is way more powerful that I usually remember. For example, the second exercise asks to select all the <p> except the one with class="foo"

  <div>
    <p></p>
    <p class="foo"></p>
    <p></p>
    <p></p>
  </div>

This can be done with

  p:not(.foo)

But also by selecting every thing that we don't want and then negating that.

  :not(div, .foo)

gildas 4y

However, note that doc page on MDN [1] warns you it may not work in all browers.

Using two selectors at the same time is not yet supported in all browsers. Example: :not(.foo, .bar). For wider support you could use, :not(.foo):not(.bar)

[1] https://developer.mozilla.org/en-US/docs/Web/CSS/:not

Comments