nicht angemeldet
Mozilla erkennt margin-top nicht?
Hallo,
ich habe mal wieder an meiner Webseite gebastelt und folgendes festgestellt:
http://www.henning-boesch.de/index.php?topic=edhilfe&lang=de
Der IE6 (Ok, das ist kein Maßstab)
und der Oper 6.05 zeigen alles korrekt an
Im Mozilla 1.0 gibt es jedoch zwei Fehler
- Das Div 'Inhalt' hat nur einen Abstand von ca. 5 Pixeln vom oberen Rand und verdeckt daher den Schriftzug Hennings Webworld, obwohl das div margin-top:45px eingestellt hat.
http://www.henning-boesch.de/screen.css - In der 'downloadbox' wird die Linie zwischen Name der Datei und dem Autor manchmal hellgrau dargestellt.
Die Seiten validieren XHTML 1.0
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.henning-boesch.de%2Findex.php%3Ftopic%3Dedhilfe%26lang%3Dde&charset=(detect+automatically)&doctype=(detect+automatically)
und im Prinzip CSS 2.0
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.henning-boesch.de%2Fscreen.css&warning=1&profile=css2
(wegen -moz-opacity, aber das sollte im Mozilla keine Probleme machen und wird auch richtig interpretiert)
Kann jemand diese Fehler erklären. Da die Seiten ja validiert werden, wüßte ich nicht wo ich suchen sollte.
Gruß,
Henning
--
Gruß aus Braunschweig
Gruß aus Braunschweig
-
Hallo Henning,
hier ein erster Tipp ins Blaue: kollidiert evtl. height:auto; mit margin-top:45px;? Will heißen, bleibt der Fehler bestehen wenn height:auto; auskommentiert wird?
Grüße,
Utz
-
Hallo,
hier ein erster Tipp ins Blaue: kollidiert evtl. height:auto; mit margin-top:45px;? Will heißen, bleibt der Fehler bestehen wenn height:auto; auskommentiert wird?
Ja, der Fehler bleibt bestehen. Wenn ich margin-left ändere wird das vom Browser registriert. Bei margin-top kann ich eingeben was ich will es passiert nichts. (auch wenn height:auto entfernt wird)
Gruß,
Henning--
Gruß aus Braunschweig-
Hallo Henning,
Ja, der Fehler bleibt bestehen.
Schade. Na gut, dann versuch ich's mal mit Denken (was aber so gut wie immer schief geht :-):
margin-top definiert den Abstand zum Eltern- bzw. Vorgängerelement. Du hast zwei aufeinanderfolgende Divs notiert (id="menue" und id="inhalt"), also definiert margin-top bei #inhalt den vertikalen Abstand zu "menue". Die beiden stehen aber nebeneinander (was Du durch margin-left erreicht hast), also hat ein Browser die Glaskugel zu bemühen, wie denn der vertikale Abstand zweier nebeneinander stehender Elemente zu interpretieren sei.
Hier eine Idee wie das - falls es denn stimmt - zu lösen wäre:
<div id="menue">...</div>
<div id="inhaltcontainer">
<div id="inhalt">...</div>
</div>Wobei #inhaltcontainer den margin-left bekommt und #inhalt den margin-top - mithin den Abstand zu seinem Elternelement #inhaltcontainer, der seinerseits rechts neben #menue platziert wurde.
Grüße,
Utz
-
Hallo,
Der menu-Div ist durch position:absolute eigentlich aus dem normalen Textfluss herausgenommen.
Hier eine Idee wie das - falls es denn stimmt - zu lösen wäre:
<div id="menue">...</div>
<div id="inhaltcontainer">
<div id="inhalt">...</div>
</div>Wobei #inhaltcontainer den margin-left bekommt und #inhalt den margin-top - mithin den Abstand zu seinem Elternelement #inhaltcontainer, der seinerseits rechts neben #menue platziert wurde.
Da momentan der Body das Elternelement ist, musste doch margin-top sich auf Body beziehen, oder nicht?
Gruß,
Henning--
Gruß aus Braunschweig-
Hallo Henning,
ich hab ein bisschen rumgespielt und bin auf folgendes gekommen:
Mozilla scheint sich an einem fehlenden Bezugselement zu stören. Wenn Du bei #toplogo das position:absolute; rausnimmst, geht's plötzlich. Wenn Du alternativ irgendwo vor <div id="inhalt"> ein leeres <div> </div> einfügst, geht's auch, wenn #toplogo das position:absolute; behält. Der Bezug auf Body als Elterelement klappt dann, wenn Du die Definition von <div id="toplogo"> und <div id="menue"> an der Stelle löschst und z.B. an das Ende des Body setzt, geht auch alles. Ob das ein Bug ist oder durch irgendwas in irgend ner Spec legitimiert ist weiß ich nicht, und wie das überhaupt zu Stande kommt (werden Zeilenumbrüche vielleicht als benachbarte Textknoten betrachtet?) auch nicht.
Die dritte meiner Varianten sollte Dir aber als Workaround für's erste helfen.
Grüße,
Utz
-
Hallo,
Die dritte meiner Varianten sollte Dir aber als Workaround für's erste helfen.
Das habe ich jetzt gemacht und es klappt.
Vielen Dank noch mal.Gruß,
Henning--
Gruß aus Braunschweig -
Hallo,
eine andere - vielleicht auch akzeptable - Lösung wäre, den inhalt-div auch absolut zu positionieren.
Und eine Anregung: den menue-div durch position:fixed mitscrollen lassen (macht der IE natürlich nicht mit; deshalb position:absolute vor der fixed-Definition beibehalten).
Gruß
juergen.ter
-
Hallo,
Und eine Anregung: den menue-div durch position:fixed mitscrollen lassen (macht der IE natürlich nicht mit; deshalb position:absolute vor der fixed-Definition beibehalten).
Das habe ich bei einer anderen Seite von mir gemacht. Das Problem dabei ist das fixed Elemente von selbst keine Scrollbalken erhalten. Wenn das Browserfenster also kleiner als der fixed Bereich ist, kann man diesen Bereich nicht mehr erreichen. Abhilfe schafft ein overfow:scroll, das aber Opera erst seit 7.0 (glaube ich zumindest) kann.
Aber eine gute Idee ist es schon. Es würde auch die Navigationsframes mal überflüssig machen.
Gruß,
Henning--
Gruß aus Braunschweig
-
-
-
-
-
-