nicht angemeldet
float-Fehler im IE7
Hi,
ich bin gerade ueber folgendes gestolpert:
Der Code (innerhalb eines XHTML 1.0 Strict-Dokuments)
<img src="example.png" style="float: left;" />
<h1 style="border: 1px solid black;">
Headline
</h1>
produziert (wie gewuenscht) ein Bild links innerhalb des Rahmens der Ueberschrift und setzt den Text "Headline" rechts daneben. Wenn ich diesen Code nun um eine Hoehenangabe fuer das <h1>-Element erweitere,
<img src="example.png" style="float: left;" />
<h1 style="border: 1px solid black; height: 1em;">
Headline
</h1>
wird das Bild im IE7 (andere IE-Versionen nicht getestet) optisch ausserhalb der Ueberschrift gesetzt, d.h. der linke Rahmen der Ueberschrift ist rechts des Bildes.
So lange ich gebraucht habe, um den Grund fuer die falsche Darstellung herauszufinden, so wenige Ideen habe ich auch, wie ich sie umgehen kann, d.h. die erste Ausgabe zu bewirken, obwohl eine Hoehe angegeben ist. Ich moechte es nicht umgehen, indem ich das Bild im Code in die Ueberschrift setze, weil dann in meinem Fall das Padding der Ueberschrift Aerger macht (und es semantisch bloed waere, obwohl ich da zu Kompromissen bereit waere).
Kann jemand helfen?
Und noch eine generelle Frage zum Thema:
Im Firefox (2) kann man beide oben beschriebenen Effekte erzielen, indem man den overflow von <h1> auf visible bzw. hidden setzt. Der <http://de.selfhtml.org/navigation/suche/index.htm?Suchanfrage=box-modell@title=Erlaeuterung des Boxmodells> auf SelfHTML kann ich das nicht entnehmen. Ist das entsprechend der Spezifikation oder ein Fehler?
danke, viele Gruesse
der Bademeister
-
Hi,
Der Code (innerhalb eines XHTML 1.0 Strict-Dokuments)
<img src="example.png" style="float: left;" />
<h1 style="border: 1px solid black;">
Headline
</h1>> produziert (wie gewuenscht) ein Bild links innerhalb des Rahmens der Ueberschrift und setzt den Text "Headline" rechts daneben. Wenn ich diesen Code nun um eine Hoehenangabe fuer das <h1>-Element erweitere, dann triggerst du damit [hasLayout](http://www.satzansatz.de/cssd/onhavinglayout.html) im IE, was oftmals zur Behebung von Darstellungsfehlern dienen kann, aber manchmal auch wieder anderes "kaputt" macht. > wird das Bild im IE7 (andere IE-Versionen nicht getestet) optisch ausserhalb der Ueberschrift gesetzt, d.h. der linke Rahmen der Ueberschrift ist rechts des Bildes. > > So lange ich gebraucht habe, um den Grund fuer die falsche Darstellung herauszufinden, so wenige Ideen habe ich auch, wie ich sie umgehen kann, d.h. die erste Ausgabe zu bewirken, obwohl eine Hoehe angegeben ist. Ich moechte es nicht umgehen, indem ich das Bild im Code in die Ueberschrift setze, weil dann in meinem Fall das Padding der Ueberschrift Aerger macht (und es semantisch bloed waere, obwohl ich da zu Kompromissen bereit waere). Dann bleibt als erster trivialer Workaround immer noch, beide in ein Containerelement zu stecken, und dem den Rahmen zu geben. > Und noch eine generelle Frage zum Thema: > Im Firefox (2) kann man beide oben beschriebenen Effekte erzielen, indem man den overflow von <h1> auf visible bzw. hidden setzt. Der <http://de.selfhtml.org/navigation/suche/index.htm?Suchanfrage=box-modell@title=Erlaeuterung des Boxmodells> auf SelfHTML kann ich das nicht entnehmen. Ist das entsprechend der Spezifikation oder ein Fehler? overflow mit einem anderen Wert als dem Default visible sorgt dafuer, dass das Element einen eigenen [Block Formatting Context](http://www.w3.org/TR/CSS21/visuren.html#block-formatting) bildet, siehe auch <http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#wunderwaffe-overflow> MfG ChrisB -- „This is the author's opinion, not necessarily that of Starbucks.“-
Hi ChrisB,
Das Thema hasLayout ist mir neu, aber jetzt hab ich einen Überblick, was los ist.
Besten Dank für die Hilfe, sie hätte kaum besser sein können.
viele Grüße
der Bademeister
-