Using CSS Transitions on Auto Dimensions | CSS-Tricks - CSS-Tricks
We've all been there. You've got an element you want to be able to collapse and expand smoothly using CSS transitions, but its expanded size needs to be
Hey, guess what? CSS is now able to transition to height: auto . It’s still a work in progress, but you can get the details here in a more recent article . We’ve all been there. You’ve got an element you want to be able to collapse and expand smoothly using CSS transitions, but its expanded size needs to be content-dependent. You’ve set transition: height 0.2s ease-out . You’ve created a collapsed CSS class that applies height: 0 . You try it out, and… the height doesn’t transition. It snaps between the two sizes as if transition had never been set. Af
Explore this link on the map →related reading
- Animating height: auto — nemzes.netnemzes.net
- Transitionsanimations.dev
- An Interactive Guide to CSS Transitions • Josh W. Comeaujoshwcomeau.com
- Transitions.dev — Essential transitions for web appstransitions.dev
- Details That Make Interfaces Feel Betterjakub.kr
- On UI Animations - Shu Dingshud.in
- Inside Framer's Magic Motionnan.fyi
- Avoid 100vh On Mobile Web | chanind.github.iochanind.github.io
- Web Interface Guidelinesrauno.me
- CSS Basic User Interface Module Level 3 (CSS3 UI)drafts.csswg.org
- Goethe’s Advice for Young Writers by Johann Peter Eckermanntheparisreview.org
- Getting sticky with it — Troubleshooting CSS sticky positioning - DEV Communitydev.to