See the attached image-- sorry for all the censors.
Title length differs (obviously), but so then some grid items have more space than others. What's the best way to fix this?
#How do I make this grid look aligned?
naive bolt
@brazen plover you would need to set a min-height on the grid items to be at least the height of the tallest item.
brazen plover
What would fill that space, though? @naive bolt
naive bolt
@brazen plover I'm assuming you want each grid item at the same height and if so there would be empty space there. To clarify, which space are you referring to?
The other option is it looks like you have your grid rows at a certain height so you could set the grid-row: span 2 on those smaller items.
valid dune
@brazen plover Are you using flex within the cards themselves?
You could use flex-direction: column with a combination of flex-grow in order to make one element within each card expand to fill the void.
ashen night
If you don't need the bottom to line up neatly, you can achieve a masonry with CSS columns (with some break-inside avoidance).
brazen plover
If you don't need the bottom to line up neatly, you can achieve a masonry with C...
Finally getting to implementation here.
How do I get this to work with Tailwind? I have a Tailwind grid right now.