IE 6.0 und 5.01 mal anders...
Das Nordlicht
- css
0 Cheatah0 the nordlicht0 Cheatah
Hallo!
Ich habe eine Seite in XHTML 1.0 transitional codiert, die in allen Browsern läuft. Bis auf IE 6.0 und IE 5.01 - das ist ja erst mal nix ungewöhnliches. Normalerweise nehme ich dann den "erweiterten vereinfachten box model hack": * html div ( ) Funktioniert aber nicht wie gewünscht!
In meinem fall gibt es eine 760Pixel breite box "main", in der sich alles weitere abspielt. Per float positioniere ich drei Boxen untereinander (top, nav und cont). In cont (width 760px; border, margin, padding jeweils 0) gibt es nun eine linksbündige inhaltsbox (inhalt). Rechtsbündig steht - per "float: left" in "inhalt" positioniert - eine box "bild". Ich muss dieser nun für den IE (getestet in 5.01 und 6.0) eine Breite von 377Pixeln angeben, gebe ich eine größere width an, so wird die box - wohl wegen des "float" - nach unten verschoben. Der IE reagiert also so, als sei kein Platz für zwei Boxen von je 380 Pixeln Breite nebeneinander in einer übergeordneten Box "main", die 760 Pixel breit ist, sondern nur 757 Pixel. Hier der Code (ich habe nur die jeweils übergeordneten Divs hineinkopiert):
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-attachment: fixed;
background-image: url(pics/nav/bgr_fire_03.gif);
background-repeat: repeat;
margin: 0px 0 5px 50%;
}
#main {
position: relative;
width: 760px;
visibility: visible;
overflow: visible;
text-align: left;
margin: 0 0 0 -380px;
border: 0;
padding: 0;
}
#cont {
background-color: white;
width: 760px;
float: left;
}
#inhalt {
position: relative;
float: left;
width: 340px;
height: 100%;
padding: 20px;
margin-top: 0;
margin-left: 0;
font-size: 0.9em;
border: 0;
}
* html #inhalt {
width: 380px;
w\idth: 340px;
}
#bild {
width: 340px;
text-align: center;
vertical-align: middle;
margin-top: 0;
margin-right: 0;
margin-left: 380px;
padding: 20px;
background-color: #eee;
height: 100%;
border: 0;
}
*html #bild {
width: 377px;
w\idth: 377px;
}
Hier der entscheidende XHTML-Code:
<div id="cont">
<div id="inhalt"></div>
<div id="bild"></div>
</div>
Kann mir da jemand helfen?
the Nordlicht
Hi,
Normalerweise nehme ich dann den "erweiterten vereinfachten box model hack": * html div ( )
unter diesem Namen habe ich den Star-HTML-Hack noch nie gesehen.
[... IE] 377Pixeln [... andere] 380 Pixeln
Suche nach dem Three Pixel Text Jog.
Cheatah
Danke Cheatah!
Es war der double pipapo-Bug (kann den Begriff gerade nicht finden). Hilfst Du mir ne Bombe für Bill G. bauen??
Ich habe jetzt noch ein weiteres Problem, dass ich weiter oben gleich posten werde. Es geht um eine falsche Darstellung einer Border in IE6.
Vielen Dank!
the nordlicht
Hi,
Es war der double pipapo-Bug (kann den Begriff gerade nicht finden).
Peekaboo? Das glaube ich nicht. Meinst Du den Double Float Margin Bug?
Hilfst Du mir ne Bombe für Bill G. bauen??
Lass die Viren mal andere programmieren.
Cheatah