Witam, chciałbym prosić o pomoc w przy jednym problemie. Chciałbym, aby w poniższym kodzie stopka była na dole strony, a żółta przestrzeń (BODY) miała:
height = height_całej_strony - height_logo - height_menu - height_stopka.
Czyli innymi słowy wypełniała całą pozostałą część strony bez tworzenia suwaka pionowego jeżeli height contentu w BODY nie powiększa jego height-u tworząc automatycznie suwak.
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style>
*
{
margin:0
}
#base_header
{
height:150px;
background-color:green
}
#base_header_inside
{
max-width:950px;
background-color:red;
margin:0 auto;
height:100%
}
#base_menu
{
height:30px;
background-color:blue
}
#base_menu_inside
{
max-width:950px;
background-color:orange;
margin:0 auto;
height:100%
}
#base_body
{
height:auto;
background-color:yellow
}
#base_body_inside
{
max-width:950px;
background-color:pink;
margin:0 auto;
height:100%
}
#base_footer
{
height:30px;
background-color:blue
}
#base_footer_inside
{
max-width:950px;
background-color:orange;
margin:0 auto;
height:100%
}
</style>
</head>
<body>
<div style="width:100%;height:100%;background-color:#aaa;position:absolute">
<div id="base_header">
<div id="base_header_inside">LOGO</div>
</div>
<div id="base_menu">
<div id="base_menu_inside">MENU</div>
</div>
<div id="base_body">
<div id="base_body_inside">BODY</div>
</div>
<div id="base_footer">
<div id="base_footer_inside">STOPKA</div>
</div>
</div>
</body>
</html>
Pozdrawiam.