Hi guys, I appreciate this is my first post - I am somewhat of a novice at the moment so I apologize for my flaws in advance.

I have created a website that works perfectly in the latest browsers e.g; Chrome, Firefox, IE10, Safari.

However when I run the site in earlier versions of IE, the footer looses all of its styling (css). I am completely lost as to where to begin to try and fix the problem.

HTML Code:
<footer> 
 
   
 
			<foottxt><p><a href="#top" class="scroll" title="Top of page">Back to top</a></p> 
<hr> 
				
				
				
			<a href="index.html">Home |</a> 
			<a href="about-us.html">About Us |</a> 
			<a href="consultancy.html">Consultancy |</a> 
			<a href="sustainability.html">Sustainability |</a> 
			<a href="recruitment.html">Recruitment |</a> 
			<a href="clients.html">Clients </a> 
	
<fr>		          
  <div align="right">
  Copyright  1990 - 2011 Green & Kassab Limited - Independent Management Consultants. 
  <br>Green & Kassab Limited. Company Registered in England, number 04238613 
  <br>Registered Office: The Courtyard, Shoreham Road,
  <br>Upper Beeding, Steyning, West Sussex, BN44 3TN 
 
  <br><br>Site by <a href="http://www.kylebailey.co.uk">Kyle Bailey</a> 
  <br> 
  </div> 
 
  

  </fr>
  </foottxt>
  </t2> 
The html continues, however I want to try and get the styling of the text sorted before I move forward with positioning of other DIV's!

Here is the CSS:

HTML Code:
foottxt{
font-style:bold;
font-size:9px;
color:white;
}

foottxt a{
font-style:bold;
font-size:10px;
text-decoration:none;
color:white;
}

foottxt a:hover{
font-style:bold;
font-size:10px;
text-decoration:underline;
}

fr {
float:right;
}

footer {
background-image: url('images/footerbg.png');
background-repeat:no-repeat;
height:200px;
margin-top:em;
}
That is a snapshot of some relevant CSS, if you want to know anything else I can add more.

Any help would be much appreciated as I have no clue right now,

Cheers,

B