Horizontal Masonry done using CSS Grid [ Demo ] Normally the grid kinda fixes the height of each item, therefore we need to use grid-row-end property to size the items. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. This is suitable for quick and easy profile page

Therefore we harnessed the handy repeat and minmax CSS functions. How is the tab order affected by shuffling around elements like this?

Do you need a clean bottom edge? To achieve a sensible order using flex-direction: This 2-column layout has a sticky left side bar with drop down menus.