css selectors

shouldn't these two be identical https://codepen.io/bbonsaye/pen/KKBLdzW

6 Replies

can't figure out why the second one isn't working as I'm expecting it to

b1mind•2y ago

Specificity https://blog.webdevsimplified.com/2020-02/css-specificity/ https://www.youtube.com/watch?v=c0kfcP_nD9E

ohhh, the universal selector has 0 specificity, I forgot awesome, thank you again @b1mind hey @b1mind, hope you don't mind the ping since you helped me on this question, I got a follow up question since. I use Windows OS, and in there I created a low-contrast theme which is picked up by the @media (prefers-contrast: less){} media query and the built-in themes are all high-contrast which is picked up by @media (prefers-contrast: more) {} that's great I seen some people, mainly safari users, being able to give regular css values to properties in those media queries, for example, body {background-color: orange} and it works but for me, I have to use the <system-color> keywords otherwise it doesn't work I was wondering if you knew why that is I also had a question about @media (prefers-contrast: custom), can't git this one to trigger, all the contrast themes get picked up by less or more even if I don't have a less or more query, it still doesn't trigger custom

b1mind•2y ago

mmm not sure on either. both seem tied to forced-colors though far as color names go I would use #hex or hsl anyway

NazCodelandOP•2y ago

but I am not able to use regular css color values when I use the @media (prefers-contrast: ...) {...} media query I have to use <system-color> keywords like this,

  body {
    background-color: linkText;
  }

  body {
    background-color: linkText;
  }

https://developer.mozilla.org/en-US/docs/Web/CSS/system-color But I seen some tutorials where people are using regular values like

  body {
    background-color: orange;
  }

  body {
    background-color: orange;
  }

and it works

b1mind•2y ago

mmmm

Gaming

Programming

css selectors