Height это
Автор Boss Naurbiev задал вопрос в разделе Другие языки и технологии
CSS: height: 100% и получил лучший ответ
Ответ от Mix-Fighter44[гуру]
а с чего оно должно в процентах то работать? это высота, а не ширина, чтобы работать в процентах
Ответ от Ёержант[гуру]
height: 100% равен высоте родительского элемента. Это не магическое «высота всего окна» . Так что, если вы захотите, чтобы ваш элемент занял все 100% от высоты окна, то установить height: 100% будет недостаточно.
Почему? А потому, что родителем вашего контейнера является элемент body, а у него свойство height установлено в auto по умолчанию; а значит — его высота равна высоте контента. Конечно, вы можете попробовать добавить height: 100% к body, но этого тоже будет недостаточно.
Почему? А все потому же, родителем элемента body является элемент html, у которого также свойство height равно auto и он также растягивается под размер контента. А вот теперь, если добавить height: 100% и к элементу html, то все заработает.
Суммируем.. .
html, body, .container {
height: 100%;
}
height: 100% равен высоте родительского элемента. Это не магическое «высота всего окна» . Так что, если вы захотите, чтобы ваш элемент занял все 100% от высоты окна, то установить height: 100% будет недостаточно.
Почему? А потому, что родителем вашего контейнера является элемент body, а у него свойство height установлено в auto по умолчанию; а значит — его высота равна высоте контента. Конечно, вы можете попробовать добавить height: 100% к body, но этого тоже будет недостаточно.
Почему? А все потому же, родителем элемента body является элемент html, у которого также свойство height равно auto и он также растягивается под размер контента. А вот теперь, если добавить height: 100% и к элементу html, то все заработает.
Суммируем.. .
html, body, .container {
height: 100%;
}
Ответ от Gixxer[эксперт]
Потому что высота вычисляется в процентах от области контента родительского элемента (а высота у неё не указана).
Потому что высота вычисляется в процентах от области контента родительского элемента (а высота у неё не указана).
Ответ от Арсен Арутюнян[гуру]
Смотрю выше написанные ответы и удивляюсь. . .если не знаете лучше не отвечайте.
Что бы какой то элемент растянуть на всю высоту, его нужно правильно позиционировать.
Например:
<div style="position: fixed; height: 100%; width: 70%; top: 0px; left: 15%; background: lightyellow;">
</div >
И почитайте про "position", что бы знали, при каких значениях откуда начинается позиционирование.
Смотрю выше написанные ответы и удивляюсь. . .если не знаете лучше не отвечайте.
Что бы какой то элемент растянуть на всю высоту, его нужно правильно позиционировать.
Например:
<div style="position: fixed; height: 100%; width: 70%; top: 0px; left: 15%; background: lightyellow;">
</div >
И почитайте про "position", что бы знали, при каких значениях откуда начинается позиционирование.
Ответ от 3 ответа[гуру]
Привет! Вот подборка тем с похожими вопросами и ответами на Ваш вопрос: CSS: height: 100%