Как сделать, чтобы родитель отталкивался от высоты потомка, а не детей?
Есть такая незамысловатая структура:
Wrap
Content
Div
Div с высотой, условно, 500vh. Content с высотой 100vh. Мне нужно, чтобы Wrap отталкивался от высоты Divи растягивался на высоту всей страницы, то есть 500vh. Сейчас, к сожалению, его высота ограничивается высотой дочернего элемента, то есть Content’a.
Хочу в дальнейшем присвоить Content ‘Position: Sticky’ и сделать подобие фиксированной страницы, но с полноценной прокруткой по всей её высоте.
Дополнительно:
на css - никак. Если div спрятан за скролом внутри content, и у обоих обычное позиционирование, то wrap будет ориентироваться на своё содержимое, а это высота content.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для того чтобы сделать так, чтобы родительский элемент отталкивался от высоты потомка, а не от детей, можно использовать свойство CSS `overflow: hidden` или `overflow: auto` для родительского элемента.
Например, у вас есть следующая структура HTML:
```html
```
И CSS стили для этих элементов:
```css
.parent {
overflow: hidden; /* или overflow: auto; */
}
.child {
height: 200px; /* Высота потомка */
}
```
В данном случае, установив `overflow: hidden` или `overflow: auto` для родительского элемента `.parent`, вы заставите его отталкиваться от высоты потомка (`.child`), а не от его внутренних детей.
Таким образом, родительский элемент будет учитывать высоту потомка при расчете своей высоты и не будет "схлопываться" из-за внутренних элементов.
Надеюсь, это поможет вам решить вашу проблему! Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать.