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 …thx 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.

<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%;

And your footer will move to the bottom.

May I suggest reading up on
You’ll likely see these mistakes early on if you do.


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.

1 Like