Make footer go to the bottom

Question:
How can I make this footer go to the bottom of the page?


Repl link:
https://Inspiration-A-Day.sonicx180.repl.co

#footer {
  background-color:gray;
  color: white;
  padding: 5px;
 margin-bottom:0;
}

The bottom style in CSS will change the amount an element is away from the bottom of the screen. it does require a position though for example absolute. So if you want to 2% away from the bottom of the screen you would use:

#footer {
  position: absolute;
  bottom: 2%;
}

Also it is better to use the <footer> element for semantic and assessability purposes.

Will check it out. Thanks for the quick response!

1 Like

On mobile, this isn’t really good.

1 Like

Using other values for the position style or media queries should improve it.

I see. Something like the fixed or relative position?

My solution is to add a media query to make the position relative for mobile but fixed for desktop. Thanks for your help!

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.