-1

Right now I have a footer that is always at the bottom of the page. This is fine until I have more content than can fit on the page, which means when you scroll down, the footer scrolls up as if its fixed..

Here is my CSS:

   .footerWrap{
    clear: both;
    position:absolute;
    width:100%;
    bottom:0;
}

.footer {
    position: relative;
    margin-bottom: 0px;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1rem;
    background-color: #000000;
    color: #FFFFFF;
}

.footerLinks{
    padding-left: 150px;
    text-align: left;
}
.footerLinks p {
    display: inline;
}

.footerLinks a {
    color: #169e98;
}

.footerSocial{
    text-align: right;
}

And my HTML: 

<!--Footer-->
          <div class="footerWrap">
          <div class="footer">
              <div class="footerLinks">
              <a href="privacy.html">Privacy Policy</a><p> |</p>
              <a href="sitemap.html">Sitemap</a><p> |</p>
              <p>© 2017</p>
              </div>
              <div class="footerSocial">
                  <a href="https://www.facebook.com//" target="_blank"><img src="image/findfb.png" alt="Find us on Facebook"></a>
              </div>
            </div>
          </div>

Essentially, I want to put the footer Div below the text content.

l2aelba
  • 21,591
  • 22
  • 102
  • 138
dannmat
  • 45
  • 7
  • Possible duplicate of [How do you get the footer to stay at the bottom of a Web page?](https://stackoverflow.com/questions/42294/how-do-you-get-the-footer-to-stay-at-the-bottom-of-a-web-page) – l2aelba Sep 07 '17 at 20:48

1 Answers1

2

it is very easy : wrap your html code in 

<div class="page">
 ...
</div>

and just add css

.page{
 position:relative;
}

that is all

andrew s zachary
  • 167
  • 2
  • 14
  • When you say "Wrap your HTML code in this". You mean all content in the Body? Because that doesn't change anything on my page, no matter where I put the DIV – dannmat Sep 07 '17 at 20:39
  • 1
    all current page content yes and remove bottom:0; css from .footerWrap https://codepen.io/anon/pen/GvbrwL – andrew s zachary Sep 07 '17 at 20:40