Text um hr-Element floaten

[Marco]

Hallo!

Ich bin gerade dabei mit Hilfe vom Css eine horizontale Trennlinie (hr) auf die gleich Höhe wie einen Text (der dieses hr-Element umfließt) sowie ein weiteres Bild zu setzen. Leider funktioniert das nur im FF.

Hier der Code:
...

  
<style type="text/css">  
#news hr {  
display: block;  
width: 80px;  
float: left;  
margin: 5px 0;  
padding: 0;  
float:left;  
}  
  
#news span {  
float:left;  
margin: 0 5px;  
padding: 0;  
line-height: 12px;  
}  
  
#sym_s {  
display: block;  
height: 12px;  
width: 12px;  
margin: 0 5px 0 0;  
padding: 0;  
}  
</style>  

...

  
<div id="news">  
    <hr />  
    <span>read more</span>  
    <img id="sym_s" src="pfadangabe" />  
</div>  
  

Wenn ihr das im FF betrachtet (V2) seht ihr, wie es aussehen soll. Ich weiß nicht, ob es überhaupt möglich ist, nach aktuellen Standards Text oder Bilder um ein hr-Element zu floaten, deshalb wäre ich für Hinweise sehr dankbar.

Gruß
Marco