Image gallery solution / up to ~25 images per gallery / unlimited galleries

What have I done so far:

Implemented Magnific Popup library and Webflow collections to work together. There are maximum 25 fields for images in a blog post collection. (Webflow allows 30 fields per collection). If there are less images, the empty fields are filtered.

Please help me! What are the best CSS practices to make images square?

https://magnific-popup-webflow-image-gallery.webflow.io

Found the solution. Applied object-fit: cover to the image class and it worked!

https://magnific-popup-webflow-image-gallery.webflow.io

Open in Webflow.

The object-fit custom css is a great solution with a 90+ % coverage for users (browsers). Just remember that you are loading lots of extra pixels if you don’t format first. Glad you resolved your issue. Happy webflowing!