Currently in my grid, each row has its height set according to the tallest element on it. In one of these rows I have an element with a list that, if set to have an automatic height, will be very tall. I would like to set the height of that row to be the automatically set height of a specific component, not the tallest.
How it looks now:
┌───┐ ┌───┐ ┌───┐
│ o │ │ o │ │ o │
│ │ │ │ │ o │
│ │ │ │ │ o │
└───┘ └───┘ └───┘
How I want it to look (the tall one has a scroll for overflow):
┌───┐ ┌───┐ ┌───╕
│ o │ │ o │ │ o ║
└───┘ └───┘ └───╛
I could achieve something similar by setting a maximum height for this row like so: grid-template-rows: 100px;, but that doesn't work for me, I need the first grid cell to have its height automatically defined. Setting a fixed height for any component won't work for me.
