возникли проблемы с поддержкой браузера прямо сейчас.
У меня все работает так, как надеялись Firefox и Chrome, однако в сафари у меня проблемы с изображениями. В настоящее время изображение настраивается с помощью «object-fit: cover» и оказывает ожидаемый эффект на Chrome / firefox. Но для сафари, кажется, игнорировать его, и изображение очень большое. Вот скриншот. Слева - предполагаемый, справа - фактический результат. 
Вот фрагмент кода html и css моего кода, влияющего на эту строку / столбец.
<div class="feature-image">
<img class="img-1" src="@/assets/preview-images/feature 1.png" alt="">
</div>
.feature-image {
width: 50%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.img-2 {
max-width: 320px;
}
}