How to have a footer in the bottom of the page on any case?

Question

I Want to have a fixed footer at the bottom of an HTML page, even in XS an SM sizes.

When i make it relative, it depends of what is displayed, and I want it fixed at the bottom.

Can somebody help me ?

Does this answer your question? [Fixed footer in Bootstrap](https://stackoverflow.com/questions/19330611/fixed-footer-in-bootstrap) — Edric, May 19 '20 at 14:54
I find this article really helpful. https://css-tricks.com/couple-takes-sticky-footer/ The firsrt image exactly shows your problem. — Clara, May 19 '20 at 15:05

score 1 · Accepted Answer · answered May 19 '20 at 14:51

1

You can use the following style:

position: fixed;
bottom: 0;
left: 0;
right: 0;

You'll of course have to adjust it to your specific case. If you had a code example I could give you something more specific.

answered May 19 '20 at 14:51

Mihail Minkov

Yes, actually when I passed to XS an SM, The footer is at the bottom, but at the bottom of the body. So my footer stands at the middle of my page... – jozinho22 May 19 '20 at 14:56
@jozinho22 I hadn't seen this, but it probably was an issue related to `html` and `body` height definitions. Although those don't really affect `position: fixed`. – Mihail Minkov Feb 28 '21 at 18:59

score 1 · Answer 2 · answered May 19 '20 at 15:00

1

That's how you get a sticky footer

body{
min-height: 100vh;
flex-direction: column;  
}

footer{
  margin-top:auto;
}

answered May 19 '20 at 15:00

Kayc M

2 Answers2