This is a new thing that affects which selectors win. It's going to require some re-wiring of our CSS brains, because layers is this entirely new (and powerful) part of determining what styles actually get applied.
https://css-tricks.com/cascade-layers/
Nice little roundup from @ziizium including styling broken images and styled blockquotes to toggle switches and gradient effects.
https://css-tricks.com/7-practical-uses-for-the-before-and-after-pseudo-elements-in-css/
Resources aren’t requested by CSS, but by the DOM
https://css-tricks.com/resources-arent-requested-by-css-but-by-the-dom/
Love this line from @BenNadel:
We need to lean into an asymmetric reality. We need to embrace the fact that data is asymmetric and we need to design user interfaces that can expand and contract to work with the asymmetry, not against it.
https://css-tricks.com/embracing-asymmetrical-design/
It's not every day you see a new processor for building websites that reinvents the syntax for HTML and CSS and JavaScript. That's what imba is doing.
https://css-tricks.com/imba/
Here's @ChallengesCss continuing a deep look at the CSS Paint API. This time: polygon borders.
https://css-tricks.com/exploring-the-css-paint-api-polygon-border/
RT Stephanie Eckles
What's in your recent search history related to CSS? 🤔
Designing Beautiful Shadows in CSS
https://css-tricks.com/designing-beautiful-shadows-in-css/
This is an excerpt from @wladston's new book "Computer Science Unleashed" about all the groundbreaking technologies behind the World Wide Web.
https://css-tricks.com/computer-science-unleashed-chapter-1-connections/
There is a helluva gotcha with styling a element, as documented by @KittyGiraudel.
https://css-tricks.com/shadow-roots-and-inheritance/
RT Adam Argyle
media-queries-4 making confusing queries much simpler 😍
caniuse (Firefox only atm)
CSS spec
PostCSS plugin
⭐️ to show Chromium you want it
https://caniuse.com/mdn-css_at-rules_media_range_syntax
https://www.w3.org/TR/mediaqueries-4/#range-context
https://github.com/postcss/postcss-media-minmax
https://bugs.chromium.org/p/chromium/issues/detail?id=1034465
`gap` may be one of the shortest CSS property names, but means different things in different layout contexts. @patrickbrosset does a nice job breaking those down.
https://css-tricks.com/minding-the-gap/
According to the results, dang near half of developers are dissatisfied with scrolling on the web.
https://css-tricks.com/2021-scroll-survey-report/
Neat little tool to create a CMD+K interface.
https://css-tricks.com/kbar/
An Intro to JavaScript Proxy by Travis Almand
https://css-tricks.com/an-intro-to-javascript-proxy/
Building a Form in PHP Using DOMDocument
https://css-tricks.com/building-a-form-in-php-using-domdocument/
We normally think of gradients as having smooth or hard color stops, but @jimmmy shows how cool "grainy" gradients look.
https://css-tricks.com/grainy-gradients/
Heck yeah, congrats @danielpost!
https://css-tricks.com/social-image-generator-jetpack/
The point of "Just in Time" CSS is that it only generates the CSS that you actually need, because you asked for it, and no more.
https://css-tricks.com/just-in-time-css/
