Problème float sous IE

Salut a tous,

j'ai un petit problème sur une page de mon site sous IE. J'ai resynthétiser le problème : voici le code:

<div style="border:yellow 5px solid;">
	<div style="background-color:red;">
		<div style="float:left;">		
			<div style="height:100px;width:50px;background-color:blue;"></div>
		</div>
		<div style="float:left;">		
			<div style="height:100px;width:50px;background-color:green;"></div>
		</div>
	<div style="clear:both;"></div>	
</div>

Comme vous pouvez le voir sous IE la bordure jaune en bas est mordu par le block rouge.

Comment faire pour éviter celà?

Merci d'avance!

Bonjour,

Layout quand tu nous tient

<div style="background-color:red; height: 1%">