I have this code where there is simply one column with three different rows fitted to the viewport. Each row will contain an image that is fit by height. I want to make it so that if the browser is resized horizontally, and the width of that column(viewport) falls below a certain point, additional rows are then inserted on the page THAT ALSO FIT the viewport. So it would snap from fitting three rows, to fitting four rows, then five and so on, depending on the width of the one column/viewport:
https://codepen.io/Wcomp/pen/WgaXpb