33 подписчика
👩💻 Анимация по высоте/ширине авто (без хаков)
Всего три строки кода, и вы получаете плавный переход к height: auto.
& {
interpolate-size: allow-keywords;
}
p {
transition: 1s;
}
p:not(:hover) {
height: 5lh;
}
Все волшебство выполняет interpolate-size: allow-keywords. Подробнее об этом читайте в статье Анимация height: auto; (и другие ключевые слова внутреннего размера) в CSS.
Пока поддерживается только в Chromium-based браузерах.
✅ 👩💻 Chrome, 👩💻 Edge, 👩💻 Brave.
❌ 👩💻 Firefox, 👩💻 Vivaldi и Яндекс Браузер.
#css #feature #animation
Около минуты
3 октября 2024