Modern CSS Evolution: From Past Practices to Future Trends

Explore the evolution of CSS writing techniques over the past two decades in this 47-minute conference talk from CSS Day 2023. Journey through significant changes in CSS practices, from early transitions to the current "final form" and beyond. Discover how recent language additions have reshaped CSS writing methods and get insights into potential future influences. Learn about the speaker's #100DaysOfMoreOrLessModernCSS project, understanding its impact as both a valuable and challenging endeavor. Gain knowledge on various CSS concepts including preprocessors, methodologies, custom properties, relative color syntax, web components, and cascade layers. Examine real-world examples of modern CSS techniques, such as styling without HTML classes and leveraging the cascade effectively. Delve into complex selectors, component-level problems, and practical JavaScript workarounds for CSS limitations. Conclude with a look at favorite features and a timeline of CSS development, providing a comprehensive overview of past, present, and future CSS writing practices.

Intro
Thank you
Lets start again
The 100 days of CSS challenge
The Side Project
Modern CSS
What I learned
What I forgot
The changes
The past
New computer
CounterStrike
Clan
Website
Special about this site
My biggest milestones
Preprocessors
Influences
Modules
Methodologies
Other influences
Custom Properties
Relative Color Syntax
Custom Property
Default Custom Property
Web Components
Viennese Melange
CSS API
CSS Day Card
Changes in CSS
CSS attributes
Example
CSS without HTML
A strange break
No more classes
CSS styling
Custom CSS properties
Decouple component variations
Extracting stylings and using them separately
Repeating stylings
More CSS
Breaking with conventions
The Cascade
Cascade Layers
Complex Selectors
Component Level Problems
Nest Layers
Testing
What has changed
Random photo
JavaScript workaround
Layout flickering
Scrollbar gutter
Masonry
HasHas
Dialog
Hover
Has
I like JavaScript
Conclusion
Lobster
Questions
Timeline
Favourite feature
Custom property names