IE verhält sich seltsam (float / clear)

von **chricken** » 27.09.2010, 19:27

Hallo,

ich habe da ein Problem. Scheinbar habe ich float/clear noch nicht richtig begriffen oder es geht einfach nicht besser.
Ich habe das Problem mal so weit es geht auf dieser Seite reduziert:
http://chricken.de/fileadmin/glueckstadt2.html

Jeder Browser stellt es vernünftig dar, einzig der IE kocht sein eigenes Süppchen.

Wenn ich nämlich das Fenster so breit habe, dass die linke Spalte niedriger ist, als die rechte, dann springt die linke Kante des Hintergrunds ganz nach links an den Browserrand.
Möglicherweise ist dieses Verhalten schon bekannt, aber ich bekomme es einfach nicht begriffen.

Hoffentlich kann mir wer helfen
Chricken

von **sejuma** » 28.09.2010, 06:42

Vermutlich meinst du den Hintergrund vom Footer.
Das Verhalten erscheint mir auch nicht ganz logisch.
Aber damit sollte es sich lösen lassen:

Gib deiner Seite zunächst einen Doctype, indem du z.B. diesen in die allererste Quelltextzeile einfügst. Ebenso fehlt der öffnende html-Tag:

Code: Alles auswählen: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html>

Dann ersetze bei #background

Code: Alles auswählen: margin: 20px;

durch

Code: Alles auswählen: padding: 20px;

Lösche überall die relativen Positionierungen, da diese unnötig sind.

von **chricken** » 28.09.2010, 08:34

Hallo Sejuma,

vielen Dank für Deine Antwort. Leider löst sie mein Problem nicht.
Das Verhalten des Footers ist so, wie ich es will.
Ich habe mal versucht, in einem Bild zusammenzufassen, was das Problem ist. Siehe Anhang.

Der DocType bringt keine Änderung, und ein Padding statt des Margin macht nur einen breiten Rand.
Mein Problem ist vielmehr, dass im Internet Explorer ab einem bestimmten Längenverhältnis zwischen den Spalten der ganze Rahmen an die linke Kante spring. Bizarrerweise wird dadurch sonst nichts geändert.

von **Azra** » 28.09.2010, 09:08

Abstände und Größenangaben werden zusammengezählt.
Breite + Padding + Margin = Endergebnis

Das heißt, du musst Padding- und Marginwerte von Breiten und Höhen subtrahieren damit alles korrekt angezeigt wird.
Ein Container soll 200px breit und mit einem Paddingwert versehen sein:
(padding)20px + (width)160px + (padding)20px = 200px

Und das Doctype muss immer drin sein.

von **sejuma** » 28.09.2010, 11:24

Oder ordne den #footer außerhalb von #background an, also darunter und gib ihm die erforderliche Breite und margin.

von **chricken** » 29.09.2010, 15:39

Hallo und vielen Dank für Eure Antworten.
Den Doctype einzubauen habe ich probiert. Weder strict noch transitional machen einen Unterschied. Ich habe jetzt transitional drinnen und auch das fehlende <html> nachgebessert.

Ich habe irgendwie das Gefühl, dass ich mein Problem noch nicht gut genug geschildert habe.
Es geschieht nur im Internet Explorer:
Wenn der Bildschirm breit genug ist, dass die linke Spalte kürzer ist als die rechte, dann springt der Div "background" links ganz an die Kante, ohne am Inhalt irgendwas zu ändern.

Um es zu testen, lade bitte einmal die Seite
http://chricken.de/fileadmin/glueckstadt2.html
im IE und ändere dann die Fensterbreite. Dann tritt das Problem zu Tage.

Ich hoffe, es ist jetzt ersichtlich.

von **sejuma** » 29.09.2010, 17:24

Lösche überall position relative, weil unnötig und beim #footer falsch geschrieben.
Gib #background zusätzlich noch ein "haslayout" mit

Code: Alles auswählen: height: 1%;

von **chricken** » 01.10.2010, 09:22

Tatsächlich, haslayout hat das Problem behoben.
habe gleich drüber gelesen und viel gelernt.
Herzlichen Dank.

Die relatives lasse ich aber drinnen, ich weiß gerne, wie sich die Elemente verhalten.
Probleme macht es auch nicht.

Vielen Dank nochmal

Chricken

IE verhält sich seltsam (float / clear)

IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Re: IE verhält sich seltsam (float / clear)

Ähnliche Beiträge zu "IE verhält sich seltsam (float / clear)"

Wer ist online?