Philip7899
Philip7899

Reputation: 4677

How do I make my CSS footer stay at the bottom of the site on mobile browsers?

My website footer works perfectly in all browsers except on an IPads, IPhones, and Android phones. Essentially, On mobile devices, the footer is not at the bottom of the site as it should be. Here is the css for the footer:

.Footer { width: 100%; padding:10px 0; margin:0px 0 0 0; text-align:center; border-top:1px solid #b3b3b3; background-color:#d9d9d9; min-width: 1024px;}
.Footer p { color:#959595; padding:0; margin:0; font:normal 10px 'Verdana';}
.Footer a { color:#959595; text-decoration:underline;}

Here is the CSS for the body and html tags:

body { font:12px Arial, Helvetica, sans-serif; padding:0; margin:0; color:#101010; width: 100%;}
html { padding:0; margin:0;}

The website is up at avidest.com. How do I make the footer appear properly on an IPad and mobile devices? Thanks.

Upvotes: 0

Views: 4308

Answers (1)

Stephen Flee
Stephen Flee

Reputation: 71

Everytime I have needed a sticky footer, I always end up going back to this guy

http://ryanfait.com/sticky-footer/

Upvotes: 2

Related Questions