Footer Help

+1 Brandon Bennett · September 23, 2014
I'm having some trouble keeping the footer at the bottom of my website. no matter what i try to put for styling rules i can't get it fixed at the bottom. what are some things you have done to make a footer stay at the bottom? i've tried using the "fixed" and "height properties, but it still is at about the middle of the screen...

Post a Reply


Oldest  Newest  Rating
+1 James Grimshaw · September 23, 2014
Have you tried:
#myfooter {
    position: fixed;
    left: 0;
    bottom: 0;
width: 100%;
    height: 100px; /* Change this as necessary */

If you've tried everything and nothing is working, take a look at this great tutorial from phpacademy instead.

Good luck :)

0 JOhaL jaTT · September 23, 2014
may be this will help you...........
background:url("yourfolder/yourimage.jpg") repeat;

  bottom: 0px;
  margin: 0px;
  left: 0px;
  width: 100%;
  height: 40px;
  font-family: Arial;
  text-shadow: 1px 1px px black;
  border-top: 1px solid rgba(0,0,0,0.3);
  background: rgba(0,0,0,0.25);
  box-shadow: inset 0 1px rgba(255,255,255,0.3);
  box-shadow: inset 0 1px rgba(255,255,255,0.3) ,
  inset 0 10px rgba(255,255,255,0.2) , inset 0 10px 20px 
  , inset 0 -15px 30px rgba(0,0,0,0.3);
<div id="footer">
0 Brandon Bennett · September 23, 2014
Thanks you two! both sets of code helped me a good lot!
  • 1

HTML / CSS / Web Design


Discuss, share, ask, learn and teach HTML5 and CSS3.