What are CSS @layers?

⏰ Timestamps
00:00:00 - Introductions
00:03:00 - When CSS is not awesome
00:06:00 - Problem of CSS at scale
00:11:10 - Using encapsulation
00:15:40 - Ways to "fake" modules
00:24:40 - Layers vs. modules
00:30:30 - ITCSS layers example
00:37:00 - Example without layers
00:41:10 - How layers get applied
Join us for an online discussion on CSS @layers. @layers is a recent addition to CSS, introducing a modular approach to styling that offers profound advantages in code organisation and maintainability.
@layers enable developers to compartmentalise their styles into separate layers, effectively isolating various aspects of their stylesheets. This approach minimises the risk of style conflicts and simplifies collaboration within development teams. It also promotes the creation of modular, reusable styles, speeding up development and enhancing the scalability and responsiveness of web projects.
🤷‍♀️ What is FEDSA?
Front-end Development South Africa (FEDSA) is a registered non-profit organisation. They serve as an administrative umbrella for various types of projects that advance the sharing of knowledge between practitioners and aspiring practitioners within the industry.
📜 Fineprint
FEDSA's Code of Conduct is here: ctfeds.org/code-of-conduct . We're serious about offering a warm, inclusive, safe space to learn.