Подскажите, пожалуйста, как сделать так, что бы div растягивался 3:4?
2
-
3[Resizable (aspect ratio)][1] [1]:jqueryui.com/resizable/#aspect-ratio – Deonis 8 дек '13 в 9:33
-
Ну, div - это блочный элемент... он не может растягиваться. Ни туда, и ни сюда))) Вы что-то другое имели в виду? – Deus 9 дек '13 в 20:46
добавить комментарий
|
3 ответа
Есть техника с использованием padding. Пример - http://jsfiddle.net/2vqoprnr/
.ball {
width: 40%;
height: 0;
padding-bottom: 20%;
background: purple;
position: relative;
}
.ball__content {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
<div class="ball">
<div class="ball__content"></div>
</div>
можно менять высоту и ширину через стиль
var w = 100;
divEl.style.width = w + 'px';
divEl.style.height = (w * 3 / 4) + 'px';
Ширина div'а относится к его высоте как 3:4
http://jsfiddle.net/fyryzb8L/1/
div {
width: 10%; /* put any value here */
overflow: hidden;
background: red;
}
div:before {
content: "";
padding-top: 133.333%;
float: left;
}