20 NEW CSS Features You Need To Know In 2025

CSS Simplified Course: https://courses.webdevsimplified.com/...

In this video I will show you my 20 favorite new CSS features that you should be using in 2025 and beyond.

📚 Materials/References:

CSS Simplified Course: https://courses.webdevsimplified.com/...

Videos:
@layer:    • CSS Layers Are Changing How Specificity Works  
text-wrap:    • This New CSS Text Property Is Amazing For ...  
Nesting:    • How To Use Nesting In Plain CSS  
Container Queries:    • Responsive CSS Will Never Be The Same  
Relative Colors:    • How To Handle CSS Colors Like A Senior Dev  
:has:    • This Is So Much More Than Just A Parent Se...  
@property:    • @property Is One Of The Coolest New CSS Fe...  
Subgrid:    • Yet Another 5 Must Know CSS Tricks That Al...  
Multi-Value Display:    • The CSS Display Property is Changing Forever  
display: contents:    • The CSS Display Property is Changing Forever  
Logical Properties:    • Yet Another 5 Must Know CSS Tricks That Al...  
::backdrop:    • The New dialog HTML Element Changes Modals...  
transition-behavior:    • We Can Finally Animate height: auto; in CSS!  
@starting-style:    • We Can Finally Animate height: auto; in CSS!  
field-sizing:    • This CSS Property Replaces Hundreds of Lin...  
anchor:    • CSS Anchor Is The Best New CSS Feature Sin...  

Articles:
@layer: https://blog.webdevsimplified.com/202...
:has: https://blog.webdevsimplified.com/202...
@property: https://blog.webdevsimplified.com/202...
Multi-Value Display: https://blog.webdevsimplified.com/202...
display: contents: https://blog.webdevsimplified.com/202...
Logical Properties: https://blog.webdevsimplified.com/202...


🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon:   / webdevsimplified  
Twitter:   / devsimplified  
Discord:   / discord  
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00 - Introduction
00:36 - @layer
02:08 - text-wrap
02:57 - Nesting
03:30 - Container Queries
04:46 - Relative Colors
06:13 - :has
07:27 - @property
08:35 - Subgrid
09:15 - Multi-value Display
10:14 - display: contents
11:02 - Logical Properties
11:55 - ::backdrop
12:34 - transition-behavior
13:12 - @starting-style
14:20 - field-sizing
15:32 - @scope
16:44 - anchor()
18:45 - @container Style Queries
19:42 - interpolate-size


#CSS #WDS #WebDevelopment