Как сжать квадратный блок?
Есть квадратный блок 600x600px. Нужно его сжимать при уменьшении ширины окна браузера, чтобы одновременно уменьшалась ширина и высота квадрата. Нужно чтобы пи сжатии получился квадрат 200x200px.
Ответы (1 шт):
Автор решения: soledar10
→ Ссылка
Пример
body {
min-height: 600px;
}
.square {
position: relative;
padding: 0;
overflow: hidden;
max-width: 600px;
margin: 1em auto;
background-color: #00f;
}
.square::before {
content: "";
display: block;
padding-top: 100%;
}<div class="square"></div>