Re: Repeating vertical background image and a sticky footer

[sircastor]

Yeah, I should have done that in the first post…
Here’s the html:

Here’s the css (It’s mostly lifted from this page)

* {margin:0;padding:0;}



html, body {height: 100%;}



body{

background: url("images/background_red_stripe.png") no-repeat;

background-position:center top;

overflow:auto;

}



/*Opera Fix*/

body:before {

content:"";

height:100%;

float:left;

width:0;

margin-top:-32767px;/

}



#wrap {

min-height: 100%;

}



#main {

overflow:auto;

padding-bottom: 150px; /* must be same height as the footer */

width:988px;

margin:0 auto;

background: url('images/main_page_white_drop_shadow.png') repeat-y 0 0px;

}



#footer {

position: relative;

margin-top: -150px; /* negative value of footer height */

height: 150px;

clear:both;



}



#footerContent{

width:988px;

margin:0 auto;

background: url('images/main_page_white_drop_shadow.png') repeat-y 0 0px;

height:100%;

}





#side{

padding-left:24px;

float:left;

}



.sidebarBox{

margin-bottom:15px;

}



.sidebarBox a{

border:none;

}

Any thoughts or ideas?