Jump to content
Sign in to follow this  
Brian

Sticky Footer

Recommended Posts

Brian+    18
Brian

Hello,

 

How can this code be incorporated to have a real sticky footer, not just changing the the min-height settings, i.e. #site #page, #site #dynamic-content {min-height: 400px;}?

 

Here's the testing URL: http://www.thebluetreecreative.com

 

And here is the code that works for sticky footer:

* {
	margin: 0;
}
html, body {
	height: 100%;
}
.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
	height: 142px; /* .push must be the same height as .footer */
}

 

Any help would be awesome.

 

Cheers,

Brian

Share this post


Link to post
Share on other sites
Rob    547
Rob

Hi Brian,

 

I'm not a programmer, so your question may be a bit over my skill level.

 

I thought it might be possible to clone the footer section, but that doesn't appear to be one that is cloneable.  I hoped that one of the sections might provide a format for this, but alas the footer columns section only works within the footer, and is not the footer itself.  I looked too at the morefoot section, but that had similar issues with this kind of customization.

 

Unfortunately, this customization doesn't look like something that could be easily done. It really would take the help of a professional developer to avoid the many pitfalls of changing the layout.

 

Your code appears to be only CSS.  This is only part, I think, of the equation.  Somewhere, you'd have to include those elements cited in your CSS, applied to some action causing the footer to be sticky.

 

My suggestions include searching for a plugin and if that fails, go to our Pros page to seek one of our professional developers.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×