Hi,
ich habe ein absolut positioniertes DIV-Element, welches keine Breitenangaben enthält. Dieses DIV-Element enthält ein weiteres absolut positioniertes DIV-Element, welches Farb- und Paddingangaben und einen Text enthält:
<div style="position:absolute;left:10px;top:10px;">
<div style="position:absolute;left:0px;top:0px;background-color:#ffcc00;padding:10px">
Beispieltext
</div>
</div>
Alle Browser (die ich testen konnte: IE 5/6, Opera 5-7, Netscape 4) zeigen einen Bereich an, der sich der Breite und Höhe des Textes automatisch anpasst. Nur Mozilla macht es nicht. Er zeigt nur einen kleinen Bereich des inneren DIVs an, und zwar färbt er nur den Padding-Bereich ein. Die Breite des Textes berücksicht er nicht.
Wenn ich die Breite des inneren DIVs mit JavaScript abfrage, dann ist diese auch entsprechend klein. Mit der Höhe gibt es keine Probleme.
Hier das Beispiel: (der gelbe Bereich sollte sich dem Text anpassen)
<iframe src="http://www.abi01-wrg.de/test.html" width="90%" height="90%">http://www.abi01-wrg.de/test.html</iframe>
Macht Mozilla es richtig (dafür ist er ja bekannt), oder machen die anderen es richtig (Opera 7 ist ja auch bekannt für korrekte CSS-Interpretation)?
Wie ist dieses Verhalten zu erklären??
Benutze ich für das innere DIV "relative" oder "static", dann klappts auch in Mozilla. Ich muss/will aber absolute benutzen.
Als einzigste Lösung habe ich durch ausprobieren herausgefunden, dass man im äußeren DIV "overflow:auto" notieren kann, damits klappt!? Ist das die einzigst sinnvolle und logische Lösung?
Oder gibts ne bessere??
Gruß
Scooter!