tenho um design simples em css em 3 partes:
cabeçalho - largura e altura fixas
central - largura fixa e altura liquida
rodape - largura e altura fixas
Queria colocar uma imagem ou box no fim da div central, mas não estou conseguindo!
Alguém poderia me apontar o erro ou a solução?
Segue o codigo:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>liquid design</title>
<style type="text/css" >
html,body{ margin:0; width:100%; height:100%;}
#container{ background-color:#000; width:100%; height:100%;}
#site{ background-color:#f00; width:850px; min-width:850px; height:100%; min-height:100%; margin:0 auto;}
#head{ background-color:#666;width:850px; height:150px; min-height:150px; position:absolute; text-align:center;}
#centro{ background-color:#9C0; width:850px ; height:100%; text-align:center; margin-top:150px; margin-bottom:140px; position:absolute;}
.bloco{ background-color:#00F; width:200px; height:200px; margin:0 auto; vertical-align:middle;}
#foot{ background-color:#333;width:850px; height:140px; min-height:140px; bottom:0px; position:absolute; text-align:center;}
</style>
</head>
<body>
<div id="container">
<div id="site">
<div id="head">cabeçalho</div>
<div id="centro"><div class="bloco">bloco</div></div>
<div id="foot">footer</div>
</div>
</div>
</body>
</html>
Obrigada!
