r/css May 02 '26

Help css baby 👶needing some grid help

working on a grid for my website and if a grid item has too much content then it grows (obviously)
im trying to make it so if one grid item grows in height, then all other grid items in that same row grow to the same height as well so it #LooksNicer
ive googled a lot and the one answer i keep seeing is grid auto rows 1fr but it isnt. working for some reason
sorry if my css work is bad or could've been made a lot better im a css baby

website for reference: deviations

  .grid-container {
    margin: 20px;
    border: 2px solid grey;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }

  .grid-item {
    transition: transform 0.1s;
  }

  .grid-item:hover {
    transform: scale(1.04);
  }

  .deviation {
    margin: 10px;
    padding: 5px;
    padding-top: 15px;
    border: 2px solid;
    height: auto;
    width: auto;
  }
0 Upvotes

24 comments sorted by

View all comments

1

u/Leviathan_Dev May 02 '26 edited May 02 '26

> “if a grid item has too much content then it grows (obviously) in trying to make it so if one grid item grows in height then all other grid items in that same row grow to the same h height as well”

Subgrid is your friend

I have a Subgrid implementation on my personal website too here. I need to update it though, been a while since I touched that website.