Flexbox height expand and contract to cover hidden content

Hey guys,

I was wondering if you guys could help me with something,

I have been building my personal site and have come upon with a small problem.

I have been using the show and hide method from this tutorial and want to use it for each project tile in a grid.

I have been hiding it by placing a fixed-height div at the bottom with a higher z-index. But due to the hidden content being different heights for each separate project I can’t universally hide the content without using the height of the longest hidden section and applying to all of them - but this leaves large unsightly gaps between the project tiles.

I am sure there must be a solution for this using flexbox with a higher Z-index that expand and contract to fill the gaps but I can’t figure it out.

Can anyone help?

Also - I have been trying and failing for a while to use an animated .gif favicon, it shows up correctly and animates in the webflow project settings but never loads in the published site. Is this possible? are there any specific file restrictions I need to be aware of?

Share link

Thanks,

Damiaan

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.