The footer doesn't stay down

I try to put the footer at the bottom of the page but something doesn’t work…my code-pen link is here https://codepen.io/catalinux01/pen/XwVYNR …thx

https://css-tricks.com/couple-takes-sticky-footer/ try reading this article and maybe you’ll find the solution to your problem

1 Like

I see, you did not properly nest your element and you have added footer element inside iframe tag. so check it and fix.

If is it still the issue, let me know.

1 Like

You need to clear the float on the footer.

#footer {
  clear: left;
}

I would suggest not using floats unless you’re doing it for practice. There are much better ways of doing layouts. Look into flexbox and CSS grid.

3 Likes
<h2 >Struggling to find your first niche idea? not sure which niches are profitable? Click here for the guide!</h2>
</div> <----- add this
.columns {
  float: left;  <----- remove this
  width: 33.3%;
  overflow:auto;
  padding-bottom:100px;
}

And your footer will move to the bottom.

May I suggest reading up on https://github.com/xfiveco/html-coding-standards
You’ll likely see these mistakes early on if you do.

2 Likes

Thx man…I will do a research!

I mean if you remove the float you are breaking the layout. Looking at the column class I assume you want a three column layout using floats?

This is without clearing, uncomment clear: left; on the #footer to see the effect.
https://codepen.io/anon/pen/WBJxJx

1 Like