#css #scroll #height #margin
#css #прокрутите #высота #поля
Вопрос:
У меня есть следующий код:
#content {
left: 50%;
margin-left: -498px;
margin-top: 186px;
width: 984px;
min-height: 100%;
background-color: rgba(255, 255, 255, 0.875);
font-size: 16px;
position: absolute;
z-index:2;
padding-left: 8px;
padding-right: 8px;
padding-bottom: 8px;
padding-top: 8px;
font-family: calibri, sans-serif;
}
Я взял min-height: 100%; чтобы сделать div до конца, это, конечно, работает. Но у меня также есть изображение заголовка и меню, поэтому я написал margin-top: 186 пикселей;
Но теперь он будет растянут немного больше, чем до конца (поэтому у меня всегда есть возможность прокручивать, даже если это не нужно)
Таким образом, в основном высота div должна быть: 100% — 186 пикселей
Спасибо!
Ответ №1:
Используйте свойство calc в css, чтобы сделать именно то, что вы написали:
height: calc(100% - 186px);
Это имеет отличную поддержку во всех современных браузерах, включая IE9. В качестве запасного варианта для IE8 (если вас это вообще волнует), вы можете сначала установить высоту на 100%, тогда только пользователи с этим браузером получат полосу прокрутки.
Ответ №2:
Вы можете разместить свой div с абсолютной позицией для этого, используя приведенный ниже код
#content{
top: 0;
bottom: 0;
position: absolute;
}