My footer has the following CSS class:
.footer{
border-top:solid 2px #BBB;
background : url('../images/footer.png');
font-family : helvetica;
font-style : italic;
height:9em;
clear: both;
color: black;
width: 100%;
}
The page size is 4000px and I want the footer to always appear regardless of which link the user is on. I tried using position:fixed, but when I change my resolution, the footer disappears. Is there a more flexible way to keep the footer visible on the page?
EDIT:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body >
<table style="width:2048px;">
<td style="min-width:1024px;color:blue;vertical-align:top;">
[Lorem ipsum text here...]
</td>
<td style="min-width:1024px;color:red;vertical-align:top;">
[More lorem ipsum text here...]
</td>
</table>
<div style="font-family : helvetica; font-style : italic;height:9em;clear: both;color: black;width: 100%;bottom:0px;position:fixed;">
This is my footer
</div>
</body>
</html>
Could you please check and correct this?
Thank you in advance :)