Site logo

Archived topic

Sticky Footer

1 reply · Started by John on July 9, 2020

Viewing posts 1–2 of 2

Hi,

I was having difficulty finding CSS to keep the footer bar at the bottom of the browser frame when there isn't much content. This worked and I'm wondering if it can be written even more concisely.

.site-footer{
position: fixed;
bottom: 0;
left: 0;
right: 0;
}

Hi there,

thats probably as elegant as it gets :)

You may want to add some bottom margin to your Body:

body {
    margin-bottom: 60px; /* set to height of footer */
}

This means nothing gets hidden by your fixed footer.

This archived topic is closed to new replies.