footer moves up with the content about argon-dashboard HOT 6 CLOSED

Hello,

Sorry for the late response.

Please do the following changes:
In the css files add these lines:
.main-content{
min-height:100vh;
}
.footer{
position: absolute;
width: 95%;
bottom: 0;
height: 0%;
}

Please let me know if I can help you with anything else.

All the best,
Rares

from argon-dashboard.

.main-content{ min-height:100vh; } .footer{ position: absolute; width: 95%; bottom: 10px; height: 0; }
Add padding to the dive before the footer
padding-bottom: 20px

from argon-dashboard.

The only thing I'd suggest differently is setting the width to 97%, it seems to line up with the end of the container. Also, I used .pb-4 on the div before my footer.

<style>
    .main-content{ min-height:100vh; }
    .footer{ position: absolute; width: 97%; bottom: 10px; height: 0; }
</style>


<div class="container-fluid mt--6">
    <div class="row pb-4"></div>
    <footer class="footer"></footer>
</div>

from argon-dashboard.

Hello
The above solution doesn't work when the page is full of content. In that case, the footer covers content. Is there a way to keep footer at the bottom even if the site content does not fill up the available space (as asked by attilatoth86) and keep footer below the content when the page is filled up?

from argon-dashboard.

This code worked for me...

<footer id="footer-main" 
    style="clear: both;
    position: relative;
    margin-top: -50px;">
</footer>

StackOverflow Reference

from argon-dashboard.

thank you all, it worked.

from argon-dashboard.