@softshape

Как в CSS сохранить пропорции div'a?

Нужно сделать так, чтобы div заполнял все свободное место, но при этом сохранял пропорции 4:3. Пример на картинке:
466f9cb95e07426681c5c532c3cc9aa9.png
Как это можно сделать без помощи JS?
  • Вопрос задан
  • 5059 просмотров
Решения вопроса 1
Lynn
@Lynn
nginx, js, css
dabblet.com/gist/894edc6dcc6e65260acce7874830a39f

Раз нужно сохранить пропорции, таки нужно следить за пропорциями экрана.

div {
	margin: auto;	
	width: 100vw;
	height: 75vw;
}

@media screen and (min-aspect-ratio: 4/3) {
	div {
		width: 133.33vh;
		height: 100vh;
	}
}
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
ImmortalCAT
@ImmortalCAT
C# loving
@media screen and (min-width: 480px) {
    
}
@media screen and (min-width: 720px) {
    
}
@media screen and (min-width: 1080px) {
    
}

minwidth загуглите сами
но смысл один и тот же
используя препроцессор манипулировать свойствами
w3schools
google dev
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы