ARTICLE AD BOX
I'm new to CSS and website making. I'm working with grids and grid items, of course, grow taller if the content doesn't fit.
I want to make it so if one grid item is taller, the entire row grows the same height so it all looks nicely. I've searched far and wide and keep seeing grid-auto-rows: 1fr; but it doesn't work for me for some reason.
Here's some of the information (also here):
.grid-container { margin: 20px; border: 2px solid grey; display: grid; grid-auto-rows: 1fr; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } .deviation { margin: 10px; padding: 5px; padding-top: 15px; border: 2px solid; height: auto; width: auto; transition: transform 0.1s; } .deviation:hover { transform: scale(1.04); } <div class="grid-item"> <a href="0044"> <div class="deviation" style="border-color: purple;"> <img src="/.png" class="deviationicon"> <p style="color: grey; font-size: 12px;">O-0044-C</p> <p></p> <hr> <img src="/community.png" class="imgicons"> <img src="/blackiron.png" class="imgicons"> <img src="/humanoid.png" class="imgicons"> </div> </a> </div>