html - want footer to stay at bottom, but not absolute -


am making website, , have wrapper on footer, want footer sticky footer, when minimise screen , make smaller footer overtakes content , header.

    #footerwrapper {  height: 177px;  bottom: 0;  position: absolute;  width: 100%;  } 

this want makes footer go bottom of page regardless of size screen is. when minimise screen , move stays absolute hence staying in 1 page.

as want stay on page rather footer being absolute.

any ideas.

i able keep footer sticky , not overtake header using z-index. give higher divs higher z-indexes.

    #headwrapper {         padding-bottom: 0px;         position: relative;     }     #headwrapper {         z-index: 2;     height: 160px;         /* width: 960px; */         margin: 0 auto;         background: url(/images/pageimages/homeheadback.png) repeat-x;     }      #footerwrapper {         background: url(/images/pageimages/footerback.png) repeat-x;         height: 177px;         position: absolute;         width: 100%;         bottom: 0;         z-index: 1;     } 

please note #headwrapper needs specify position:relative. think may start this. worked on chrome.


Comments

Popular posts from this blog

java - WrongTypeOfReturnValue exception thrown when unit testing using mockito -

php - Magento - Deleted Base url key -

android - How to disable Button if EditText is empty ? -