Markus: Probleme mit FF und Positionierung

Beitrag lesen

Hallo,

ich habe folgenden Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
 <style type="text/css">

*{
 border:0;
 margin:0px;
 padding:0px;
}

body{
text-align:center;
height:100%;
}

bTest{
text-align:center;
position:absolute;
}

.bigBox{
position:relative;
height:100%;
width:500px;
background-color:black;
margin-left:auto;
margin-right:auto;
}

.topBox{
position:relative;
height:100px;
width:80%;
background-color:red;
margin-left:auto;
margin-right:auto;
margin-bottom:10px;
}

.left_box,
.right_box{
position:relative;
height:100px;
width:40%;
background-color:yellow;
text-align:right;
}

.right_box{
float:right;

}

.left_box{
background-color:blue;
text-align:left;
}

.littleleft_box,
.littleright_box{
position:relative;
height:50px;
width:50%;
background-color:orange;
}

.littleleft_box{
background-color:green;
}

</style>

</HEAD>
<Body class=bTest>

<div class="bigBox">bigBox
 <div class="topBox">topBox</Div>
 <div class="right_box">right_box
  <div class="littleright_box">littleright_box</Div>
 </Div>
 <div class="left_box">left_box
  <div class="littleleft_box">littleleft_box</Div>
 </Div>
</Div>
<span>Test</span>

</Body>
</html>

Die "littleright_box" hätte ich jetzt auf der rechten Seite erwartet... so wie es auch der IE anzeigt.... im FF hängt sie links an der Kante von dem div "right_box".

Habe jetzt schon über eine Stunde mich daran versucht.... leider ohne Erfolg.

Hat jemand eine Lösung, oder eine bessere Idee um die gleiche Darstellung zu erreichen ?

Gruß
Markus