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
Post a Comment