PDA

View Full Version : Footer Issues



miss pip
Jun 9th, 2010, 08:33 AM
Hey Guys,

I'm stuck on my website with making the footer stay at the bottom regardless of how much content there is.

I would appreciate it if someone could look at my site and tell me where i'm going wrong.

http://www.eatrawordie.com/

Thank you kindly

:)

SB65
Jun 9th, 2010, 09:30 AM
Have a look at http://ryanfait.com/sticky-footer/.

miss pip
Jun 9th, 2010, 05:12 PM
Thank you SB65 :)

Excavator
Jun 9th, 2010, 05:18 PM
Hello miss pip,
Try making these changes to your CSS -

html, body {height: 100%;}
.container {
min-height: 100%;
margin: 0 auto -41px;
position: relative;
width: 736px;
}
.footer {
position: absolute;
bottom: 0;
color: #666;
font-size:13px;
font-family:"Lucida Sans Unicode", Arial;
line-height: 41px;
/*margin: 0 auto;*/
text-align: center;
width: 632px;
}

Based on this example (http://nopeople.com/CSS/full-height-layout/index.html).

miss pip
Jun 10th, 2010, 04:08 AM
Thanks Excavator.

I used the first example for my site, which i've updated. Should I be using your version instead or does it not matter?

http://www.eatrawordie.com/

Excavator
Jun 10th, 2010, 04:13 PM
I prefer mine because it's simpler. Both work well in all browsers if implemented correctly though so it's up to you.

Have you validated? Check the links about validation in my signature line below.

Mike Baird
Jun 10th, 2010, 04:28 PM
That's a GREAT resource. Exactly what I needed! Thanks SB65