*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  }
html,body{
  background-color:gray;
  padding:10px}

img{
  max-width:100%;
  height:auto;
  vertical-align:middle;
  display:inline-block; 
  }
.grid-wrapper>div{
  display:flex;
  justify-content:center;
  align-items:center;
  }
.grid-wrapper>div>img{
  width:100%;
  height:auto;
  object-fit:cover;
 }
.grid-wrapper{
  display:grid;
  grid-gap:10px;
  grid-template-columns: repeat(autofit, minmax(250px, 1fr));
  grid-auto-rows:200px;
  grid-auto-flow:dense;
  }

.flex-item {
  background: gray;
  padding: 5px;
  width: 45%;
  height: 45%;
  margin: 10px;}