В Safari (на Пк, iPhone и iPad) картинки растягиваются по вертикали. Как исправить?

Question

[WalVix]

Добрый вечер, подскажите как исправить проблему с отображением сайта в safari на пк, iPhone и iPad. Картинки растягиваются по вертикали, хотя на андроиде и в нормальных браузер все работает правильно.
Адрес сайта: cityartgallery.ru

Comments

[historydev]

мета-тег view есть?

[Антон Литвиненко]

height: auto

[WalVix]

Владимир,

<meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />

[historydev]

WalVix, высота процентная у картинок?

[WalVix]

Владимир, высоту вообще не указывал

[historydev]

WalVix, как подключена картинка, через css или img?

[WalVix]

Владимир, img

[historydev]

WalVix, svg, png, jpg?

[WalVix]

Владимир, В основном jpg, но есть парочку в png

[historydev]

WalVix, height: auto; попробуйте

Answer 1

[Юрий]

Потому что флекс в сафари кривой и кривым останется, видимо.
Строке, в которой у вас лежат картинки, добавьте вертикальное выравнивание, как-нибудь так:

<div class="row d-flex justify-content-center align-items-center">
  ...
</div>

Либо можно картинкам добавить object-fit: contain.