css 粘性页脚 - http://9seeds.com/tech/sticky-footer-genesis/

Posted 2021-05-13

//* Sticky Footer Functions
add_action( 'genesis_before_header', 'stickyfoot_wrap_begin');
function stickyfoot_wrap_begin() {
	echo '<div class="page-wrap">';
}
 
add_action( 'genesis_before_footer', 'stickyfoot_wrap_end');
function stickyfoot_wrap_end() {
	echo '</div><!-- page-wrap -->';
}

html, body {
	height: 100%;
}
 
.site-container {
	height: 100%;
}
 
.page-wrap {
	min-height: 100%;
	/* equal to footer height */
	margin-bottom: -90px; 
 
}
 
.site-inner {
	min-height: 100%;
	/* equal to footer height */
	margin-bottom: -90px; 
}
 
.site-footer, .site-inner:after {
	/* .site-footer and .site-inner:after must be same height as .site-inner */
	height: 90px; 
 
}
 
.site-footer {
	background: orange;
	/* Use this for testing */
}