Dificuldade em posicionar o rodapé
Dificuldade em posicionar o rodapé
by Angelo Rogério Rubin
HTML
<div id="box_global">
<div id="box_logo">
<img class="logo" src="http://3.bp.blogspot.com/-_phRPNWiMxY/Ti73XuybGuI/AAAAAAAAAQs/-rhfrKYQNAA/s1600/caafalgumacoisa.png" alt="logo" />
</div>
<form id="box_buscar" action="#" method="get">
<input class="buscar" type="search"/>
<input class="btn_buscar" type="button" value="Buscar" />
</form>
<div id="faixa_horizontal"></div>
<div id="box_rodape"></div>
</div>
CSS
* {
margin:0;
padding:0;
}
#box_global{
padding: 250px 0 0 0;
width:100%;
height:auto;
min-height:600px;
margin:0 auto;
overflow:hidden;
background-color:#CCC;
/* Para Mozilla/Gecko (Firefox etc) */
background: -moz-linear-gradient(top, #666, #fff) repeat-X;
/* Para WebKit (Safari, Google Chrome etc) */
background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#fff)) repeat-X;
/* Para IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#666, endColorstr=#FFFFFFFF)";
/* Para IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#666, endColorstr=#FFFFFFFF);
}
#box_logo {
width:250px;
height:auto;
min-height:250px;
overflow:hidden;
margin:0 auto;
}
#box_buscar {
width:100%;
height:auto;
min-height:auto;
text-align:center;
margin:20px 0 80px 0;
overflow:hidden;
}
.logo {
width:250px;
height:250px;
}
.buscar {
padding:6px;
width:300px;
}
.btn_buscar {
padding:5px;
}
#faixa_horizontal {
width:100%;
height:50px;
overflow:hidden;
background-image:url('http://wallpoper.com/images/00/40/59/04/pattern-patterns_00405904.jpg');
background-repeat:repeat-x;
}
#box_rodape{
width:100%;
min-height:200px;
height:auto;
background-color:#000;
float:left;
}