投稿画像に便利cssでアスペクト比を固定

<div class="box">
<div class="inner zoomin1">
<a href="">
<img src="images/index-images/image01.jpg" alt="">
</a>
</div>
</div>

.box {
    position: relative;
    width: 100%;
}
.box:before {
    content:"";
    display: block;
    padding-top: 75%; /* 高さを幅の75%に固定 */
}
.box .inner {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin-bottom: 20px;
}
.box .inner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; 
  font-family: 'object-fit: cover;';
}