I am trying to make a css grid for photos but the img-element doesn't display the image in the grid item. There's nothing wrong with the url I am using since it works on other parts of the page but not in the grid system.
.wrapper {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 25px;
grid-row-gap: 25px;
}
.wrapper > div img {
max-width: 100%;
max-height: 100%;
}
<div id="content">
<div class="wrapper">
<div><img src="https://placehold.it/100x100" alt=""></div>
<div>Two</div>
<div>Three</div>
<div>Four</div>
<div>Five</div>
</div>
</div>
Where am i going wrong?