CSS теперь поддерживает вложенность, как в SCSS!

Раньше, чтобы писать вложенные правила, мы использовали препроцессоры вроде SCSS. Теперь такая возможность появилась напрямую в CSS, и это меняет подход к стилям.

👨‍💻 Как это выглядит:

.card {
  padding: 16px;

  &:hover {
    background: #f0f0f0;
  }

  .title {
    font-weight: bold;
  }
}

Такой код теперь можно писать без SCSS — прямо в .css файлах, если используется современный браузер или бандлер с поддержкой CSS Nesting (например, Vite, PostCSS).

✅ Преимущества:

Меньше дублирования классов;

Логичная структура и читаемость;

Больше контроля над стилями в контексте.

⚠️ Поддержка пока не во всех браузерах (например, Safari и Chrome уже поддерживают), поэтому перед использованием важно проверять совместимость.

#css #вложенность #frontend #scss #лайфхак