html - Sticky footer when including footer.php

361

I was wondering how I could make my footer stick to the bottom of the page, no matter how long the page is. I'd include my footer.php file by using include('footer.php') at the bottom of every page. I have already searched for a good answer but nothing I found works because every tutorial assumes you make your footer on every single page instead of including it. Does anyone know what CSS i'd have to use to be able to do this?

Footer HTML:

<html>
   <body>

      <footer>This is my footer</footer>

   </body>

</html>

Index.php example:

<html>
   <head>

      <?php
      include('nav.php');
      ?>  

   </head>

   <body>

      <p>Blah blah blah</p>

      <?php
      include('footer.php')
      ?>   

   </body>

</html>

Thank you

102

Answer

Solution:

I think your footer.php file should contain only footer element and its content:

<footer>...</footer>

then add to your css:

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px; // or any suitable height
    display: block;
}
html {
    position: relative;
    min-height: 100%;
}

939

Answer

Solution:

I'm not sure, but you may also need to include white space at the bottom of your page content to avoid some of it being blocked by your footer.

759

Answer

Solution:

I don't think you can close and open the body and the html twice, when you do it like this that's how the html page look like:

<html>
<head>

  <?php
  include('nav.php');
  ?>  

</head>

<body>

  <p>Blah blah blah</p>

  <html>
  <body>

     <footer>This is my footer</footer>

   </body>

  </html>   

  </body>

</html>

so you should make the footer like this:

<footer>This is my footer</footer>

</body>

</html>

and your html page like this:

<html>
<head>

  <?php
  include('nav.php');
  ?>  

  </head>

   <body>

  <p>Blah blah blah</p>

  <?php
  include('footer.php')
  ?>

And if I understood you correctly your css should contain position:fixed as you can read here: https://www.w3schools.com/cssref/pr_class_position.asp

People are also looking for solutions to the problem: php - Distinguishing ID's

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question