Поддерживать соотношение сторон в соответствии с высотой
Мне нужно поддерживатьширина элемента в процентах от егорост, Так как высота меняется, ширина обновляется.
Противоположность достижима при использовании значения% для padding-top, но padding-left в процентах будет в процентах от ширины объекта, а не его высоты.
Так с разметкой вот так:
<div class="box">
<div class="inner"></div>
</div>
Я хотел бы использовать что-то вроде этого:
.box {
position: absolute;
margin-top: 50%;
bottom: 0;
}
.inner {
padding-left: 200%;
}
Для обеспечения коробкисоотношение сторон поддерживается в соответствии с его высотой, Высота плавная из-за ее% поля - при изменении высоты окна высота окна тоже будет изменяться.
Я знаю, как добиться этого с помощью JavaScript, просто интересно, есть ли чистое решение только для CSS?