Simple Header and Footer Parallax Effect
Let’s take your basic header->content->footer structure inside of a wrapper.
The first thing you’ll need to do is set the position of the header and footer fixed to the top and bottom respectively with a
Next we’ll give the content a minimum height to avoid having the footer lost in space in our example, a solid background color so it can eat stuff, and a
border-top: 1px solid black;
border-bottom: 1px solid black;
Now we set the wrapper margin off the top and bottom the same size as the header and footer.