CSS - высота 100% не распространяется на контент

Я уже задал еще один вопрос об этом, но мне было трудно объяснить без JSfiddle. Я только что потратил около 20 минут на эту скрипку!CSS - высота 100% не распространяется на контент

http://jsfiddle.net/4AYyX/9/

У меня есть расширяемые DIV-х, так что «контейнер» должен растягиваться до длины расширенных Div-х годов. Проблема в том, что когда div расширяются, содержимое исчезает со страницы, а не растягивается. Я попробовал добавить прописку и т. Д., Но ничего не работает.

Сценарий JS, связанный выше, является проблемой, с которой я сталкиваюсь.

html, body { 
    height: 100%; 
} 
#wrapper { 
    height: 100%; 
    margin-bottom:20px; 
}

ОБНОВЛЕНО FIDDLE ПРОВЕРЬТЕ СНОВА

источник

2013-12-23 MRC

Так что проблема «Нижний колонтитул» dosen't простирания в остальной части тела? Поэтому попробуйте удалить свойство height в теге #wrapper:

#wrapper { 
    margin-bottom:20px; 
}

источник

2013-12-23 12:02:17 megatxi

Проблема была в том, что у меня было переполнение скрыто. Нижний колонтитул не является проблемой. Проблема в том, что страница расширяется, но в контейнере нет. http://cis.kitoit.com/feedbackreview/ – MRC

Контейнер также расширяется. Проблема в правильности границы? Просто поставьте '

' внутри div # col1 вместо div # col2. И добавьте нижнее дополнение в нижней части div # col1 (например, 40px). – megatxi

Нет. Проблема заключается в том, что основной контейнер вокруг сайта не расширяется. Спасибо за попытку. – MRC

Попробуйте min-height: 100%; вместо этого.

источник

2013-12-23 11:54:26

Кажется, что нужно работать на скрипке .. просто не на моей живой странице. – MRC

Это сайт: http://cis.kitoit.com/feedbackreview/ – MRC

Вам нужно удалить padding-bottom и margin-bottom на #container DIV

Смотреть это FIDDLE

запас и отступы добавляются высоты 100%, так что stetches содержание вниз. вы также можете использовать имущество box-sizing см. here

источник

2013-12-23 11:57:34

Это не проблема, которую я испытываю. Проблема в том, что она не растягивается. – MRC

Некоторые небольшие ошибки стиля, просто сделайте коррекцию, как показано ниже.

Стиль нижнего колонтитула не должен быть абсент, а переполнение контейнера не должно быть скрыто. и вы хорошо идти

и некоторые другие Лил вещи нужно исправлен

#footer { 
    bottom:0; //removed position style 
} 

#container { 
    position: relative; //overflow removed 
    top: 5px; 
    width: 400px; 
    height: 100%; 
    margin: 0 auto 0; 
    box-shadow: 0 0 5px rgba(159, 159, 159, 0.6); 
    -o-box-shadow: 0 0 5px rgba(159, 159, 159, 0.6); 
    -webkit-box-shadow: 0 0 5px rgba(159, 159, 159, 0.6); 
    -moz-box-shadow: 0 0 5px rgba(159, 159, 159, 0.6); 
    padding-bottom:150px; 
}

источник

2013-12-23 12:02:15 Kirk

Спасибо. Переполнение было проблемой. Кроме того, теперь страница расширяется, но в контейнере нет. http://cis.kitoit.com/feedbackreview/ – MRC

CSS - высота 100% не распространяется на контент

ответ

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