-1

CSS code of my body and my footer in this moment:

I just can't to fix my footer at the bottom of my page. I read a lot of solutions present of www but any works for me. Thanks for help me!

body {
  background: #ffffff;
  color: #737f85;
  font-family: "Tahoma", Tahoma, Arial, sans-serif;
  font-size: 100%;
  line-height: 25px;
  font-weight: 400;
  padding: 0;
}


.footer-sidebar {
  background-color: #ccff66;
  margin: 0;
  padding: 55px 0 0px;
  width: 100%;
  height: 100%;
  text-align: justify;
}
Community
  • 1
  • 1
Carlo17
  • 51
  • 4

2 Answers2

0

Can you put your demo code on codepen.io?

Anyway, you can try this to make your footer always stay in bottom:

body {
      background: #ffffff;
      color: #737f85;
      font-family: "Tahoma", Tahoma, Arial, sans-serif;
      font-size: 100%;
      line-height: 25px;
      font-weight: 400;
      padding: 0;
      height: 500px; /*remove this, I just put it here to make it clear*/
    }

    .footer-sidebar {
      background-color: #ccff66;
      margin: 0;
      padding: 55px 0 0px;
      width: 100%;
      text-align: justify;
      /*add this*/
      position: fixed;
      bottom: 0;
    }
<div>
  this is some text
</div>

<footer class="footer-sidebar">This is footer</footer>

If the footer is cover a part of body, put padding-bottom: 100px with 100px is the height of your footer

Luu Hoang Bac
  • 433
  • 6
  • 17
  • Scuse but i'm new on stackoveflow, my site is wordpress and what I have to post on codepen.io? I want fix the footer without using position: fixed. Thanks for reply! – Carlo17 Nov 14 '18 at 15:38
  • You're welcome. Can I know why you don't want to you position: fixed? You can use position: absolute instead. Do you want me to make a demo for you? – Luu Hoang Bac Nov 14 '18 at 15:44
  • I don't want position: fixed because while I scroll up my page the footer remains. I think my problem is the height of tag of bootstrap. If you have time, I would be very grateful for a demo. Thanks! – Carlo17 Nov 14 '18 at 15:48
  • I'm ready to fix your code, but sorry I don't understand your idea now. So, what do you want to do with your body and footer? Tell me – Luu Hoang Bac Nov 14 '18 at 15:51
  • I'd like to fix the footer at the bottom and ensure that while scroll up remains at the bottom. I can write position: fixed in the css but the result is not correct, I can show you with a live demo in my website. Scuse me but i don't speak very well English, I hope get the point across though. – Carlo17 Nov 14 '18 at 16:02
  • So, you want your footer to stay in bottom when scrolling up, but when scrolling down, it wouldn't fixed in the bottom, hah? If I misunderstand your idea, please tell me, or give me a live demo like what you said. Take a look at your website above, I still don't understand what you mean – Luu Hoang Bac Nov 14 '18 at 16:07
  • Finally, I solve the problem setting the height of the page content container: .site-content { min-height: 100vh; } .page-content { min-height: 100vh; } Thanks very much for your time!! – Carlo17 Nov 14 '18 at 16:22
0

There isn't enough content in the content-section(The space between header and footer). Specify the height of Site Content Section.

.site-content {
    height: 100vh;
}
Umair Qazi
  • 195
  • 3
  • 9