У меня есть отзывчивое фоновое изображение со следующими свойствами
background: url( '@{sitePath}/main_banner.png') center no-repeat;
max-width: 100%;
z-index: -10;
height: 475px;
background-size: contain;
Изображение должно иметь возможность уменьшаться (как это происходит сейчас), но без большой высоты (475 пикселей) для небольших устройств. 100% минимальная и стандартная высота не работают, и я хочу избежать указания индивидуальной высоты для разных медиа-запросов, если смогу.
Кто-нибудь знает, как я могу сделать это эффективно отзывчивым?
Спасибо