Очень часто новички, создавая своё первое детище используют обыденные и привычный шаблон, который состоит из шапки, навигационного меню, блока контента и футера (header-content-sidebar-footer). Вот как выглядит такой шаблон:

И всё вроде бы хорошо. Однако сам помню, как впервые столкнулся с проблемой, когда нужно было, чтобы сайдбар, имел такую же высоту как и блок контента, т.е. по рабоче-крестьянски это звучит так: “Дотянуть DIV до футера”. Решение этой как оказалось простой задачи ниже:

#header {
height:80px;
border-bottom:1px #666 solid;
background-color:#ddd;
}

#block {
width:800px;
margin:0 auto;
overflow: hidden;
border:1px #666 solid;
}

#content {
float:left;
width:600px;
height:400px;
background-color:#eee;
}

#sidebar {
float:right;
width:200px;
margin-left:-150px;
margin-bottom: -2000em;
padding-bottom: 2000em;
border-left:1px #666 solid;
background-color:#aaa;
}

#footer {
height: 75px;
width: 800px;
border:1px #666 solid;
border-top:none;
clear: left;
margin: 0 auto;
background-color:#ddd;
}
[/css]

Вот впринципе и все. Скачать исходник можно здесь. Если есть какие-то вопросы, можете задавать их тут, либо поискать ответ на форуме вебмастеров.

Сообщение Тянем DIV появились сначала на Блог Stafox'a.