Hallo zusammen,
ich hab ein paar Probleme mit einem relativ simplen CSS Layout, zu finden hier:
Seitentitel
Quelltext:
Code:
<body>
<div style="width:450px; height: 98%; margin: 0 auto; background-color:#060606; border: 1px solid #000000;">
<div style="width:400px; margin:auto; margin-top:15px; margin-bottom:15px; text-align:left;">Logo</div>
<div style="width:400px; height:100px; background-color:#454545; margin:auto;"></div>
<div style="width:400px; margin: auto;">
<div style="width:200px; height:350px; background-color:#45F543; float:left; text-align:left; padding:5px;">
<div style="height:95%;">
Testtext <br><br><br><br><br><br><br><br><br><br>
Testtext <br><br><br><br><br><br><br><br><br><br>
Testtext <br><br><br><br><br><br><br><br><br><br>
Testtext <br><br><br><br><br><br><br><br><br><br>fd
</div>
<div style="text-align:right; height:10px; border: 1px solid #000000;">BUTTON</div>
</div>
<div style="width:200px; height:100px; background-color:#Fb452F; float: right; text-align:left; padding:5px;">Testtext</div>
<div style="width:200px; height:100px; background-color:#ABFFA2; float: right; text-align:left; padding:5px;">Testtext</div>
<div style="width:200px; height:100%; background-color:#BBAFF2; float: right; text-align:left; padding:5px;">
<div style="height:90%;">
Testtext
</div>
<div style="text-align:center; height:10px; border: 1px solid #000000;">BUTTON</div>
</div>
</div>
</div>
</body>
Im IE8 wird die Seite eigentlich fast korrekt angezeigt, die lilane Box rechts unten soll aber so lang wie die Box Links werden, also automatisch verlängert werden. Die oberen beiden bleiben beide 100px hoch. Gucke ich mir jetzt die Seite im Firefox an stimmt überhaupt nichts mehr, die beiden Spalten sind nicht nebeneinander, die Linke Spalte wird nicht verlängert usw.
Erkennt da jemand auf anhieb ein Problem?
Cya