Возникла следующая задача, нужно сделать квадрат по центру экрана, который бы пропорционально масштабировался.
Тоесть:
К примеру у нас расширение экрана браузера более 2000px. В центре расположен квадрат исходя из этого:
#table {
width: 100%;
max-width: 1024px;
min-width:424px;
height:770px;
position: relative;
margin: 0 auto;
border: solid 1px red;
}
1024px на 770px
если расширение браузера к примеру уменьшается и становиться 900px, то данный квадрат получит следующие атрибуты:
width: 900px(100%) а вот height должно быть пропорционально width. Тоесть нужно при каждом ресайзе вычислять height таким образом, что бы он был пропорционален width
Подскажите пожалуйста как это можно сделать?