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