netscape 6 macht <div>s zu gross
Pascal Will
- css
hoi!
hab n paar <div>s plaziert, aber netscape 6 rendert die zu gross. in einem .css-file hab unter anderem folgendes deffiniert:
div { padding:2px; border:1px solid #000000; text-align:justify; position:absolute; [...unwichtig...] }
mir ist nicht klar warum netscape 6 und ie 5.x da noch unterschiede haben sollten!? vielleicht kann sich das ja mal einer auf meiner seite anschauen?
bis denne, pascal.
Moin!
hab n paar <div>s plaziert, aber netscape 6 rendert die zu gross. in einem .css-file hab unter anderem folgendes deffiniert:
div { padding:2px; border:1px solid #000000; text-align:justify; position:absolute; [...unwichtig...] }
mir ist nicht klar warum netscape 6 und ie 5.x da noch unterschiede haben sollten!? vielleicht kann sich das ja mal einer auf meiner seite anschauen?
Es ist in der Tat nicht so, daß Netscape 6 die DIVs zu groß rendert, sondern daß IE5 die DIVs zu klein rendert. Jedenfalls, wenn du noch eine width-Angabe beigefügt hast.
Erst der IE 6 im Standard-kompatiblen Modus macht es endlich so, wie der Standard des W3C es verlangt.
Die Angabe width bezeichnet den für den Inhalt zur Verfügung stehenden Raum. Außenrum kommen breitenmäßig dazu: padding, border und margin.
Der IE kriegt es aber hin, die width-Angabe so zu interpretieren, daß die padding-Breite von width abgezogen wird und das Ergebnis den zur Verfügung stehenden Platz ergibt. Also sind diese DIVs zu klein im Vergleich mit dem Standard.
Genaueres kann man aber nur bei Kenntnis deines Quelltextes sagen.
- Sven Rautenberg
Der IE kriegt es aber hin, die width-Angabe so zu interpretieren, daß die padding-Breite von width abgezogen wird und das Ergebnis den zur Verfügung stehenden Platz ergibt. Also sind diese DIVs zu klein im Vergleich mit dem Standard.
hi danke fuer die schnelle antwort. hast du vielleicht ne idee wie ich des am einfachsten loesen koennte?
ca. 60 % meiner besucher sind mim ie5.x unterwegs... soll ich etwa auf den rest sch******??
mehrere .css files fuer verschiedene browser?
javascript abfrage und dann die breite dyn. schreiben lassen?
hast du bessere ideen? bin grad so faul... :o)
bis denn, pasi.
Yo!
hast du bessere ideen? bin grad so faul... :o)
<div>s schachteln:
.aussen { width:100px; }
.innen { padding:5px; border:solid 3px black; }
<div class="aussen"><div class="innen">Der Inhalt hier</div></div>
Der äußere DIV hat bei padding:0px in allen Browsern die gleiche Breite. Der innere DIV macht sich naturgemäß (alle DIVs handeln so) so breit, wie er kann - hier eben so breit, wie der äußere DIV erlaubt: 100px. Alle Browser kriegen es dann hin, noch 3px Border und 5px Padding außen hinzulegen, und die width des inneren DIVs - davon spricht niemand mehr, die berechnet sich automatisch. Fein, nicht? ;)
Ansonsten könntest du auch folgendes versuchen:
.dasdiv {width:100px; padding:5px; border:solid 3px black; }
<div class="dasdiv"><img src="transparentpixel.gif" width="100" height="1">Der Inhalt hier</div>.
Wenn du das DIV durch eine Grafik zwingst, 100 Pixel Innenmaß zu haben, wird auch der IE das verstehen und Platz schaffen, obwohl er ja nur 100px - 2*5px = 90 px Breite haben dürfte.
- Sven Rautenberg
Hi,
Sven hat natürlich recht. Aber bevor Du _nur_dafür_ Browser sniffing betreibst und unterschiedliche Style sheets verwendest, hier einer meiner allerliebsten Links, der an zig Beispielen vormacht, wie man das mit einem Style sheet hinkriegt, und das so, daß selbst Opera damit klarkommt:
http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html
Schlaf gut
Angy
Hi,
Sven hat natürlich recht. Aber bevor Du _nur_dafür_ Browser sniffing bectreibst und unterschiedliche Style sheets verwendest,
Hm, davon hat doch niemand (insbesondere nicht ich) gesprochen. Verschachtelte DIVs und die Aufteilung der Styles auf zwei Klassen funktioniert browserübergreifend prima.
hier einer meiner allerliebsten Links, der an zig Beispielen vormacht, wie man das mit einem Style sheet hinkriegt, und das so, daß selbst Opera damit klarkommt:
http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html
Das Problem dort: Da wird ein _Bug_ des IE 5 ausgenutzt, um zuerst die IE-Breite festzulegen, dann mit der für normal versteckten "}"-Klammer die Style-Regel zu schließen und hinterher für normale Browser die Breite nochmal festzulegen.
Das kann man solange machen, bis der Internet Explorer plötzlich die erste, in Wirklichkeit nicht schließende Klammer standardgerecht ignoriert und auch die zweite Breitenangabe liest, aber bei der Berechnung der Breite trotzdem noch falsch liegt.
Soll heißen: Diese Version ist sowas von wacklig IMHO, daß sie verboten gehört. Sonst passiert irgendwann wieder genau das, was bei der Einführung des Netscape 6 auch schonmal passierte (und unzählige Male davor in anderen Bereichen auch): Bestehende Seiten funktionieren mit dem neuen Browser nicht (damals war's z.B. das fehlende document.layers)
Verschachtelte DIVs tun genau das, was sie laut Standard tun sollen, und das "paßt" zufällig mit dem zusammen, was man selbst will. ;) Und es wird immer so funktionieren, weil's den Standard trickreich ausnutzt, um einen Berechnungsfehler auszugleichen. :)
- Sven Rautenberg
hi
Das kann man solange machen, bis der Internet Explorer plötzlich die erste, in Wirklichkeit nicht schließende Klammer standardgerecht ignoriert und auch die zweite Breitenangabe liest, aber bei der Berechnung der Breite trotzdem noch falsch liegt.
naja, zum Glück rechnet der MSIE jetzt erstmal richtig, und das bevor der die Klammer ignoriert. Das Ergebnis ist allerdings das gleiche: statt dass der Bereich in Mozilla zu breit ist, ist er letzt im MSIE6 und MSIE5/Mac zu klein!
Grüße aus Lüneburg
Kai