My footer kept floating up in the middle of the page until I found out about grid-template-rows
Last Tuesday I was finishing up a portfolio site for a friend in my apartment and my footer looked fine on my big monitor but on my laptop it was sitting right in the middle of the page. I had the body set to display grid with just one column and the footer was in row 1 along with everything else, so it was just stacking wherever the content ended. I changed the body to grid-template-rows: auto 1fr auto and put the footer in the last row, and it snapped to the bottom instantly no matter how short the page was. Then I added min-height: 100vh so it actually had room to push down. Anyone else run into that where grid feels like it should work but the rows are doing something weird?