CSS Grid is capable of automatically placing items on implicit rows and columns. The browser will first ignore min-height: 100% to calculate the size of the grid cells, but it will use the height: 0 in its calculation. But you said that the image size needs to be 0. But I am making an exception for the hovered image.
Table of contents
Building the gridCreating the hover effectAdding more imagesA full-screen gallery of imagesLet’s dig even deeperWrapping upSort: