dresscode | Dress up your code with a beautiful graphical user

Context may or may not be important here: I'm using Ghost on Github Pages via Buster. Buster is a tool that generates a static site from a local Ghost blog, so that it can be hosted properly on static site hosting. The blog post I'm looking for help with is hosted here: http://dresscode.danhakimi.com/why-i-love-belted-coats-and-cinched-waists/. Inspecting elements seems to work pretty effectively, and more effectively than I could copy all the relevant HTML, CSS and Javascript over here. As a disclaimer: I wrote none of this code, and am not a developer by trade, but have played enough with web frontend technology that I should be able to understand most of what's going on.

Aside from one detail I'll touch on later, this works well in Firefox on multiple platforms, and in Internet Explorer. In safari, the images show, but can't seem to set height correctly, at least on my laptop -- at full screen, the images are stretched out, but they respond nicely as I change the window's height. So I'm pretty sure the problem involves the way different browsers process adaptive heights... But I have no idea how to handle that.

The strange thing is what happens in Chrome (on both desktop and android): the images aren't visible at all. I go in and inspect element, and... the only way for me to get images to show is to set the height on kg-gallery-row to a fixed pixel count. Obviously, that's not a practical solution -- I want the heights to set responsively, properly... I've seen a lot of guides talking about setting the flexbox height to 100%, but that isn't doing anything, no matter where I do it.

The last detail worth considering -- although it's a less significant issue -- is that none of the zoomable boxes open correctly, locally or on production, in any browser. They seem to be targeting some area much further down. If you can help with that, I appreciate it, but the priority is just getting the galleries to show.