Как решить проблему в скролинге css?

Question

[david2555]

Здравствуйте! помогите пожалуйста
есть такой блок


есть один большой блок, и внутри несколько маленьких блоков.

Когда у большого блока задано ширина в пикселях и плюс overflow-x: scroll, то элементы внутри и скролл нормально работают.
И когда большому блоку даю значение в процентах, например 25%, то он нормально берет 25%.

Проблема в том, что при уменшении экрана когда ширина блока начинает уменьшаются, то скролл не работает, и блок берет значение от маленких блоков и все, больше не уменьшается ( то есть сумма ширины четерх блоков)
(проблема возникает только в процентах)
Как сделать, чтобы большой блок при уменьшении не брал ширину внутровых блоков

Всем спасибо!

Answer 1

[Andrew Ghostuhin]

1. Для начала покажи код.
2. Тут речь не про CSS, а JS, CSS не может ничего "брать"

Answer 2

[Максим]

Вся правда в том что ширину скролящегося блока должен считать js так как css это не умеет ...
И процентами в расчёте пользоваться не стоит а использовать надо max-width тогда этот блок будет ужиматься до min-width а если не указать то до 0

Это примерная реализация :https://codepen.io/topicstarter/pen/qMyJJx?editors=1100