You have put clear: both; in the footer style but that isn't enough to drag down the bg.jpg background in #content. You need a clear div inside the #content div after the floated divs because an u***oated div has a height and will tell the parent to carry down the background to cover it:-
Code:
<div id="rightContent">
<p>good bye good bye good byegood bye good bye good byegood
bye good bye good byegood bye good bye good bye</p>
</div>
<div class="clear"> </div>
</div>
<div id="footer">
and this style:-
Code:
.clear { clear: both; width: 100%; height: 0; visibility: hidden; }
Your footer text is at the top of the footer. If you want to position it lower, don't add margin-top which will create a space above the footer, but add padding-top to footerText:-
Code:
.footerText {
text-align:center;
margin: 5px 0 0 0; padding-top: 8px;
}
Code downloaded to my PC will be deleted in due course.
WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.