Как создать прокручиваемый элемент div с процентной высотой, не сжимая дочерние элементы и не обрезая внешний родительск

Как создать прокручиваемый элемент div с процентной высотой, не сжимая дочерние элементы и не обрезая внешний родительск ⇐ CSS

1 сообщение • Страница 1 из 1

Anonymous

Как создать прокручиваемый элемент div с процентной высотой, не сжимая дочерние элементы и не обрезая внешний родительск

Цитата

Сообщение Anonymous » 25 сен 2024, 03:19

Я работаю над проектом React, где мне нужен прокручиваемый элемент div в макете, использующем процентную высоту. Однако я столкнулся с проблемой: либо прокручиваемый контент обрезается, либо одноуровневые элементы неожиданно уменьшаются.
Я воссоздал макет своего проекта как можно более минималистичным, но проблема все еще остается. Вот jsFiddle:

https://jsfiddle.net/loucims/tk0dj538/17/
Когда я устанавливаю

Код: Выделить всё

overflow: hidden

на

Код: Выделить всё

#content

div,

Код: Выделить всё

#flaps

div сжимается до тех пор, пока его не станет видно. Если я установлю

Код: Выделить всё

min-height

Код: Выделить всё

#flaps

div, список выходит за пределы содержимого, и поскольку

Код: Выделить всё

#content

имеет

Код: Выделить всё

overflow: hidden

часть контента обрезана.
Мне нужен

Код: Выделить всё

#scrollContainer

чтобы можно было прокручивать без сжатия

Код: Выделить всё

#flaps

div или обрезка содержимого. Как мне этого добиться?
Любая помощь будет принята с благодарностью!

Подробнее здесь: https://stackoverflow.com/questions/790 ... inking-sib

1727223563

Anonymous

Я работаю над проектом React, где мне нужен прокручиваемый элемент div в макете, использующем процентную высоту. Однако я столкнулся с проблемой: либо прокручиваемый контент обрезается, либо одноуровневые элементы неожиданно уменьшаются.
Я воссоздал макет своего проекта как можно более минималистичным, но проблема все еще остается. Вот jsFiddle:

https://jsfiddle.net/loucims/tk0dj538/17/
Когда я устанавливаю [code]overflow: hidden[/code] на [code]#content[/code] div, [code]#flaps[/code] div сжимается до тех пор, пока его не станет видно. Если я установлю [code]min-height[/code] в [code]#flaps[/code] div, список выходит за пределы содержимого, и поскольку [code]#content[/code] имеет [code]overflow: hidden[/code] часть контента обрезана.
Мне нужен [code]#scrollContainer[/code] чтобы можно было прокручивать без сжатия [code]#flaps[/code] div или обрезка содержимого. Как мне этого добиться?
Любая помощь будет принята с благодарностью! 

Подробнее здесь: [url]https://stackoverflow.com/questions/79019426/how-to-make-a-scrollable-div-with-percentage-height-without-either-shrinking-sib[/url]

Ответить

1 сообщение • Страница 1 из 1