Probleme mit Höhen im DIV-Layout

Status
Nicht offen für weitere Antworten.

CodeSeven

Grünschnabel
Hallo,

ich weiß, dass es schon einige solcher Themen gibt, aber bisher habe ich irgendwie mein Problem nicht lösen können. Ich habe ein Design mit zwei Spalten und eine ist, logischerweise, mal höher und mal kleiner als die andere Spalte - leider gibt es dann Probleme mit dem Hintergrund - aber nur im Firefox.

Beispiel: http://www.4mor3.de/index.php?page=downs

Dort schleift der IE noch den Hintergrund mit, was im FF leider nicht klappt. Hab schon verschiedene Sachen ausprobiert und ich denke, dass ich bei der kompletten Struktur wohl etwas Unfug getrieben habe.... kann mir da irgendjeman weiterhelfen?

Vielen Dank!
 
Hallo,

als erstes würde ich dir vorschlagen dein (X)HTML Dokument zu reparieren so dass es zumindest sauber auf XHTML TRansitional validiert. Du hast da einige Fehler drinnen, z. B. sind die Texte in den div-Tags ohne jegliche Formatierung, musst sie in einen <p></p> oder in ein anders Blockelement einschließen. Dann solltest du auch die <img>-Tags wieder schließen!

als zweites schreibst du in der CSS bei #page-main { clear:both; } mit rein, bei #page-info schmeißt du den height:90px raus, und den <br style="clear:both" /> auch schleunigst wegkicken und dann dürfte es in Browsern die CSS richtig interpretieren wie der Mozilla/Firefox auch funktionieren.

Hope it helps
Liverson
 
Erstmal danke für deine Hilfe. Nach ca. 45 Minuten habe ich wohl auch dafür sorgen können, dass die Seite überhaupt valide ist - der Stylesheet war es ja glücklicherweise schon.

z. B. sind die Texte in den div-Tags ohne jegliche Formatierung, musst sie in einen <p></p> oder in ein anders Blockelement einschließen
Das wusste ich nicht mal und hab immer gedacht, dass die div-Tags dafür reichen. Das habe ich in #page-misc schonmal geändert; bei den anderen Seiten werde ich es gleich noch nachholen.

Dann solltest du auch die <img>-Tags wieder schließen!
Erledigt; wusste garnicht, dass ich das so häufig vergessen habe.

page-info schmeißt du den height:90px raus
Erledigt.

und den <br style="clear:both" /> auch schleunigst wegkicken
Erledigt; sollte da eigentlich garnicht mehr drin sein - war irgendeine bekloppte Idee etwas auszuprobieren.

als zweites schreibst du in der CSS bei #page-main { clear:both; } mit rein
Das ist die Lösung des Problemes und gleich die Erzeugung eines neuen Problemes. Denn dann fängt der Inhalt #page-main erst da an, wo #page-misc aufhört - somit rutscht der Gesamte content nach unten.
 
Status
Nicht offen für weitere Antworten.
Zurück