✔ Seitenlayout nicht im IE

Status
Nicht offen für weitere Antworten.
A

Arndtinho

Erfahrenes Mitglied
Hallo,

ich möchte folgendes Seitenlayout erstellen:
Eine "Top"-Spalte und darunter zwei "Bottom"-Spalten.
Code: 
|---------------------------------|
|                                 |
|-------|-------------------------|
|       |                         |
|-------|-------------------------|
So sieht mein CSS-File dazu aus:
HTML: 
body {
   background: #E4E4E4;
   text-align: center;
   width:      100%;
}

#container {
   margin-top: 20px auto;
   width:      800px;
   height:     400px;
   text-align: left;
   border: 1px green solid;
}

#top {
   border: 1px black solid;
   width:  800px;
   height: 200px;
}

#left {
   float: left;
   border: 1px blue solid;
   top:    220px;
   width:  200px;
   height: 200px;
   margin-top: 0px;
}

#right {
   border: 1px red solid;
   width:  600px;
   height: 200px;
   margin-left: 200px;
}
Und so sieht die Seite dazu aus:
HTML: 
<body>

   <div id="container">

      <div id="top">
      </div>

      <div id="left">
      </div>

      <div id="right">
      </div>

   </div>
</body>
Nun habe ich folgenden Fehler:
IE hingegen wird das <div>-Element "right" zwar rechts neben <div>-Element "left" dargestellt, aber nicht auf gleiche Höhe.
Wo liegt mein Fehler?

Gruß,
Arndtinho
 
Zuletzt bearbeitet:
Gemäß dem Boxmodell wird die Rahmenstärke zur Breiten- / Höhenangabe eines Elements hinzuaddiert.

Somit ist die linke Box 202 und die rechte Box 602 Pixel breit, verfügbar sind im DIV #container aber nur 800 Pixel.
 
Hallo Arndtinho,

Arndtinho hat gesagt.:
#left {
float: left;
border: 1px blue solid;
top: 220px;
width: 200px;
height: 200px;
margin-top: 0px;
}
Zum Vergrößern anklicken....

Ich würde sagen es liegt daran, dass div "left" nicht 200px, sondern 202px breit ist, da der Border links und rechts zur Breite dazugerechnet wird. Versuch mal eine Breite von 198px.

Hannes
 
Dann markiere bitte zukünftig solch "gelöste" Themen auch selbständig als erledigt.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück