Размер растяжки div в нижней части страницы

Я пытаюсь создать свою первую веб-страницу. Но у меня проблема, я много искал об этом, но я до сих пор не могу ее решить. Итак, проблема в том, что мой div (что-то вроде фона для левой стороны страницы, у него нет контента, только цветной фон) не растягивается до нижней части страницы, он просто растягивается на дно экран, поэтому, когда я прокручиваю вниз, div отсутствует. Похоже, что этот (http://postimg.org/image/aiiabtue1/)Размер растяжки div в нижней части страницы

HTML:

<body> 
    <div class="left_strip"></div> 
</body>

CSS:

.left_strip { 
    position: absolute; 
    left: 50%; 
    width: 203px; 
    height: 100%; 
    top: 158px; 
    background: rgb(251, 236, 236); 
    margin-left: -500px; 
}

источник

2015-05-24 user3511714

Вместо использования% попробуйте использовать точное значение пикселя тела тега.
Что также может помочь использовать значение%, превышающее 100, это также, похоже, работает при тестировании.

источник

2015-05-24 20:08:56 AmperPil

Спасибо, я уже решил. – user3511714

Используйте position: relative на теге кузова и bottom: 0 вместо height: 100% на .left_strip.

Только с position: relative на теге тега элемент будет 100% высоты, но из-за 158px расстояние от верхней части будет 158px ниже содержания.

bottom: 0 зафиксирует нижнюю часть элемента в нижней части ближайшего «позиционированного» (относительного, абсолютного, фиксированного) родительского элемента.

body { 
 
    position: relative; 
 
} 
 
.left_strip { 
 
    position:absolute; 
 
    width:203px; 
 
    top: 158px; 
 
    bottom: 0; 
 
    background-color: blue; 
 
} 
 
.content { 
 
    height: 2000px; 
 
    background-color: red; 
 
    margin-left: 250px; 
 
}

<div class="content"></div> 
 
<div class="left_strip">Test content</div>

источник

2015-05-24 20:11:24

Это сработало! Большое спасибо! Вы сделали мой день :) – user3511714

Размер растяжки div в нижней части страницы

ответ

Смежные вопросы