Как сделать пустые блоки с высотой уменьшающейся пропорционально?

Question

[Антон Кауэр]

Допустим у меня есть главный блок в котором находятся другие дочерние блоки.

Можно ли сделать так чтоб при сжатии главного блока, размеры высоты и ширины дочернего блока изменялись, а то у меня изменяется только ширина, высота не меняется. Верстаю во флексах.
Просто не могу понять, как это сделать с пустыми блоками без содержимого и использования jquery?

Comments

[Максим]

а как вообще это может пригодится ? для чего это ?

Answer 1

[Руслан Галиев]

Это имеется в виду?

Comments

[Антон Кауэр]

Спасибо)

Answer 2

[Александр Лысенко]

Допилил таки, но сами понимаете, такое нагромождение костылей лучше не пихать в проект. Зато работает )

Comments

[Антон Кауэр]

Спасибо)

Answer 3

[Дима Паутов]

Без скриптов css так не умеет.
https://jsfiddle.net/opqtL30y/

Есть костыльный вариант, поместите внуть блока картинку пропорцией 1 к 1. А поверх позиционируйте контент.
Это говно, а не решение, т.к. порождает кучу не приятных сюрпризов

Comments

[Александр Лысенко]

безсодержимого и использования jquery?

[Дима Паутов]

AlexanderZe: ну так css так не умеет!

[Александр Лысенко]

Дима Турков: Так и следовало автору написать, я думаю вариант с jquery он и сам знает.

[Дима Паутов]

AlexanderZe: на этом сайте есть люди, которые даже такого не знают! Мне же не известно!
Дополнил ответ

[Александр Лысенко]

Дима Турков: Вы забыли учесть первоначальные размеры блоков

[Дима Паутов]

AlexanderZe: с чего бы это вдруг? Я же беру размер блока в цикле

[Александр Лысенко]

Дима Турков: У вас квадраты

[Александр Лысенко]

Дима Турков: Только css

Answer 4

[name surname]

типа так можно www.mademyday.de/css-height-equals-width-with-pure...

Answer 5

[Антон Кауэр]

Нашел ещё решение связанное с размерами вьюпорта это размеры в vw и vh позже выложу.