📡 You're offline — showing cached content
⚡ New version available!
Quick Access
🗺️ Roadmaps 🃏 Flashcards 📚 Series 🎓 Tutorials 🗺️ My Path 🎤 Mock Interview ⚡ Cheat Code 📄 Resume Builder 🛠️ Dev Tools
Tutorials › CSS Mastery › CSS Modern Features

CSS Modern Features

5 min read
Modern CSS highlights: :has() parent selector, native nesting, container queries, scroll-driven animations, @layer cascade control, oklch() colour space, color-mix() for blending colours, and light-dark() for dark mode.

New CSS Features (2024)

  • :has() — parent selector
  • CSS Nesting — native, no preprocessor
  • Container Queries — respond to container size
  • Scroll-driven animations — no JS
  • @layer — manage cascade layers
  • color-mix() — mix colours in CSS
  • light-dark() — automatic dark mode
  • field-sizing: content — auto-grow textarea