Я пытаюсь установить высоту содержимого красного гибкого элемента на высоту синего гибкого элемента, когда высота синего гибкого элемента больше.
Для работы полосы прокрутки необходимо установить высоту. Как установить такую же высоту, как у синего гибкого элемента?
Я хочу, чтобы высота красного гибкого элемента составляла 100% страницы. Ближайший результат, который я могу получить, - это установить высоту div внутри красного гибкого элемента на 100vh.
Когда содержимое синего гибкого элемента меньше красного гибкого элемента, у меня есть желаемый результат, но когда содержимое синего гибкого элемента больше, возникает проблема.
Кажется очевидным ответом является установка высоты контейнера родительского класса, но она должна быть 100%, чтобы синий гибкий элемент мог расти.
.container {
display: flex;
border: 1px solid gray;
}
.menu {
border: 1px solid red;
flex-grow: 1;
}
.menu-content {
width: 200px;
height: 100vh;
overflow-y: auto;
}
.content {
border: 1px solid blue;
align-self: flex-start;
height: 100%;
overflow: hidden;
}