Resources for CSS is Awesome
Note started: February 2023
I consider this note done.
Features
The Foundation
-
Cascade Layers
-
Container Queries
-
CSS Nesting
-
:has
- https://www.bram.us/2023/01/12/sibling-scopes-in-css-thanks-to-has/?utm_source=pocket_saves
- https://www.bram.us/2022/12/14/a-nth-childanb-of-s-polyfill-thanks-to-css-has/
- https://css-tricks.com/solved-with-has-vertical-spacing-in-long-form-text/
- https://codepen.io/jh3y/pen/JjvapBM
- https://css-irl.info/animated-grid-tracks-with-has/
-
:where
-
:is
-
Colour syntax
- https://webkit.org/blog/10042/wide-gamut-color-in-css-with-display-p3/
- https://evilmartians.com/chronicles/oklch-in-css-why-quit-rgb-hsl
- https://chriscoyier.net/2023/01/26/relative-color-syntax-plzzzzz/
- https://wildbit.com/blog/accessible-palette-stop-using-hsl-for-color-systems
- https://codepen.io/argyleink/pen/RwyOyeq
-
Grid & Subgrid
The Tools
- @supports
- @media queries
- Custom Properties
- logical properties / writing modes
- aspect-ratio
- inset
- New Viewport Units
- accent-color
Performance
- content-visibility
- contain
Future
-
View Transition API
-
CSS Speech
-
display visually-hidden
-
https://chriscoyier.net/2022/12/21/things-css-could-still-use-heading-into-2023/
-
https://meyerweb.com/eric/thoughts/2023/02/08/css-wish-list-2023/
-
Interop 2023 https://css-irl.info/interop-2023/
Conclusion
Resources
- https://alistapart.com/article/dao/
- https://frankchimero.com/blog/2015/the-webs-grain/
- https://www.zeldman.com/2014/06/10/the-color-purple/
- https://www.matuzo.at/blog/2022/100-days-of-more-or-less-modern-css/
- https://ishadeed.com/article/conditional-css/
- What's new in responsive design by Rachel Andrew
- Nordic.js 2019 • Rachel Andrew - Refactoring (the way we talk about) CSS
- https://www.netlify.com/blog/fun-parallax-scrolling-css-for-matterday/
- https://www.joshwcomeau.com/css/understanding-layout-algorithms/