Html – Extend footer wrap to width of page

csshtmlshtml

I've made a footer wrap outside the content wrap (which everything else is in). I would like to make the footer wrap extend to fill the width of the page and I would like it to be fixed on the bottom. Here's the code:

footerWrap {

background-color:#000;
width: auto;

}

footer {

margin: auto;
text-align:center;
width:965px;
height:150px;
background-color:#000;
border:#000 inset medium;

}

The website is item9andthemadhatters.com please let me know if you need any other code or info. Thanks!!

update:

html {
padding:0;
height:100%;
width: 100%;
}

body{
margin: -1px 0 0 0;
background-color:#FFF;
font-family: calibri;
background-image:url(images/item9HeaderSideFiller.gif);
background-repeat: repeat-x;
padding:0;
height:100%;
width: 100%;
}

wrap {

width: 965px;
margin:auto auto;
min-height:462px;
max-height:4000

px;

footerWrap {

background-color:#000;
position:absolute;
bottom:0;
width:100%

}

footer {

margin: auto;
text-align:center;
width:965px;
height:150px;
background-color:#000;

}

}

Best Answer

To fill the page

width:100%

To stay at the bottom of the page a solution could be

position:absolute;
bottom:0;

notice that in both body and html you have to set

padding:0
height:100%;
Related Topic