javascript - Sticky footer without page wrap -
following fiddle works fine if content above footer wrapped in page-wrap
, on less content footer sticks bottom else there scroll. there way make fiddle in way should not depend on page-wrap
, have apply css on footer only. requesting because there on 50 pages made in way , adding ss footer. have change header file footer.
http://codepen.io/chriscoyier/pen/uwjjr
* { margin: 0; } html, body { height: 100%; } .page-wrap { min-height: 100%; /* equal footer height */ margin-bottom: -142px; } .page-wrap:after { content: ""; display: block; } .site-footer, .page-wrap:after { /* .push must same height footer */ height: 142px; }
edited:
http://jsfiddle.net/bwtwl/1178/
add code jquery:
$('.page-wrap').css('min-height',($(window).height()-142)+'px');
and css:
/* mostly: http://ryanfait.com/sticky-footer/ */ * { margin: 0; } html, body { height: 100%; } .page-wrap { /* equal footer height */ height:auto; } .site-footer { background: orange; height:142px; display:block; }
without .page-wrap:after
Comments
Post a Comment