Как ограничить высоту блока суммой высот заданного количества потомков без скрипта?

Question

[imko]

<div class="parent">
	<div class="child">1</div>
	<div class="child">2</div>
	<div class="child">3</div>
	<div class="child">4</div>
	<div class="child">5</div>
	<div class="child">6</div>
	<div class="child">7</div>
</div>

У .parent стоит overflow: auto;
Требуется ограничить ему максимальную высоту, таким образом чтобы было видно допустим ровно первых 4 .child, остальные в прокрутке.
Можно подогнать руками, и каждый раз пересчитывать при изменении любого из размеров детей. Можно написать скрипт который суммирует высоту и ставит ее в max-height родителю. Хочу найти способ обойтись и без хардкода высоты и без скрипта
Ставить какое-то значение максимальной высоты не требуется, главное чтобы за прокруткой прятались остальные потомки за заданным

Comments

[Kvason]

я хочу сьесть конфетку, но так, чтобы ее не открывать, не совершать движений руками и желательно не жевать

[imko]

Kvason, лень двигатель прогресса) Было бы куда удобнее не ожидать загрузки всех стилей и изображений прежде чем запустить скрипт подсчитывающий высоту, разве нет? И не иметь необходимости как либо обрабатывать изменения размера в реальном времени или думать над порядком выполнения нескольких таких скриптов если этот блок содержал бы другой высчитывающийся

[imko]

Kvason, отступы ты же руками не подписываешь каждому элементу а пишешь flex и ему justify-content?)

[Иван Батурин]

imko, Пади не такой уж нагруженный скрипт, чтоб его не использовать..

[Вадим]

Хочу найти способ обойтись и без хардкода высоты и без скрипта

Хотите.

Ближайшее и единственное, насколько мне известно, что есть в css и где-то близко к тому, о чём Вы спрашиваете это line-clamp

[Сергей delphinpro]

Если высота элементов произвольная, то без скрипта никак не обойдётесь.