Proposed solutions (CSS Masonry, Flex) seem to only work with predefined dimensions of either height or width. In my case, I wish the blocks to have different sizes, without stretching. I am not against using javascript, I just don’t know how.
Hello,
There are several types of blocks of varying sizes (ordered randomly). Upon using float, the blocks stack in a row until they reach the edge of the container and then continue stacking on the next line from the closest block in it's path. This eventually leads up to a lot of free space on one side. blocks ,float: left
Is it possible to stack blocks more naturally that they take up empty space on the screen, rather than follow the float method? fake stack I have also tried flex, but from what I've experimented with, the blocks then always form a row and the best you can do is make them fill up the space. Which is nice, but not what I'm looking for.
I thought that about using a column, as that would place the blocks from top to bottom, rather than left to right, or vice versa, with float. But I couldn't make that work.
Thanks for any tips and help.
