Würfel aus Containern

Status
Nicht offen für weitere Antworten.

Wolfsbein

Erfahrenes Mitglied
Hallo
ich möchte aus vier div Containern einen Würfel bauen:
Code:
#textTopLeft    {width:300px;
                height:200px;
                border-right:2px dashed #ffcc00;
                border-bottom:2px dashed #ffcc00;
                float:left;
                padding:3px;
                }
                
#textTopRight  {width:300px;
                height:200px;
                border-bottom:2px dashed #ffcc00;
                float:left;
                padding:3px;
                padding-left:10px;
                
                }
                
                
#textBotLeft    {clear:left;
                width:300px;
                height:200px;
                border-right:2px dashed #ffcc00;
                float:left;
                padding:3px;
                }

#textBotRight  {
                width:300px;
                height:200px;
                float:left;
                padding:3px;
                padding-left:10px;
                }

<div id="textTopLeft">
oben links
</div>


<div id="textTopRight">
oben rechts
</div>



<div id="textBotLeft">
unten links
</div>


<div id="textBotRight">
unten rechts
</div>
Firebird macht es richtig. Nur hätte ich gerne, dass es unter Opera und dem IE auch funktioniert :(. Wie könnte ich das umgehen?
 
Ich hab mal den Code in eine HTMl geschrieben und zwei Screenshots gemacht.
1x IE 5.5 und
1x Opera 7.20

Alles als RAR angehängt...
 

Anhänge

  • würfel.rar
    10,8 KB · Aufrufe: 30
Danke ich habe es jetzt so gemacht:
Code:
#textTopLeft    {clear:both;
                width:300px;
                height:205px;
                border-right:2px dashed #ffcc00;
                border-bottom:2px dashed #ffcc00;
                float:left;
                padding:3px;
                margin-top:20px;
                }
                
#textTopRight  {width:300px;
                height:205px;
                border-bottom:2px dashed #ffcc00;
                float:left;
                padding:3px;
                margin-top:20px;
                
                }
                
                
#textBotLeft    {clear:left;
                width:300px;
                height:205px;
                border-right:2px dashed #ffcc00;
                float:left;
                padding:3px;
                }

#textBotRight  {
                width:300px;
                height:205px;
                float:left;
                padding:3px;
                
                }
Außerdem ist um die vier Boxen noch eine Große, die die Breite und Höhe festlegt. Dann funktioniert es auch im IE.
 
Status
Nicht offen für weitere Antworten.
Zurück