I’m trying to build a drop down from scratch - to better understand them. I’m expecting an element set to hide overflow to completely be hidden until triggered. But that’s not happening.
https://www.loom.com/share/bc436f420b67485895414db1819fe60b
Here is my site Read-Only:
https://preview.webflow.com/preview/practice-69891b?utm_medium=preview_link&utm_source=designer&utm_content=practice-69891b&preview=e918299a72d482fbda43d1b3774d8169&workflow=preview
So the reason why you have an excess on the animation is because height and padding are two different things.
Setting an element’s height to 0 will not affect the padding of that element, like how a change in margin won’t affect a change in padding.
To make this custom dropdown, you should put padding on the content/insides instead of the container.
Thanks Pendragon. I’d been giving margin to every component as well as a border to keep track of each.
