Hallo,

ich bin in Sachen XHTML und CSS ein blutiger Anfänger. Ich habe 1999 (*räusper) mal HTML gelernt und möchte nun eine bereits bestehende Seite technisch auf den neuesten Stand bringen. Nun habe ich das o.g. Problem. Die URL zum Beispiel lautet:

info-fibromyalgie Startseite

Die nach rechts floatierten Container werden im IE7 alle unter dem Textfeld dargestellt. Ich habe schon versucht das mit "position: absolute;" zu regeln aber das führt zu falschen Darstellungen bei anderen Auflösungen. Habe auch schon versucht den ganzen rechten Bereich in einen eigenen Container zu packen. Das Problem bleibt aber.

Vielleicht hat ja jemand Zeit und Lust sich das Ganze mal anzuschauen.

Vielen Dank
Jan

Dann wäre warscheinlich ein erster Schritt die Fehler zu korigieren:

[Invalid] Markup Validation of http://www.info-fibromyalgie.de/NeueSite/ - W3C Markup Validator

Am wichtigsten wäre dabei die Zeichencodierung korrigieren. Im META-Element steht die Seite sei UTF-8, das Dokument ist jedoch in ISO-8859-1.

Als erstes musst du mal die HTML-Struktur klar aufräumen. Du hast da einen undurchsichtigen Wust an DIV-Elementen, die kreuz und quer gefloatet sind.

Nimm drei Grund-DIVs in "main" (z.B. "sidebar-links", "content", "sidebar-rechts") die du positionisert (z.B. alle drei links Floaten, oder alternativ die Sidebars jeweils link und rechts floaten und "content" gar nicht floaten mit Margins links und rechts jeweils so groß wie die Sidebars - mehr findest mit Google under "css 3-column layout"). In diesen drei Elemente tust du alles andere rein, dann brauchen die nicht mehr positioniert zu werden.

Schmeiss außerdem sämtliche leeren DIV-Elemente raus, die du nur für Hintergrundgrafiken benutzt. Diese Hinetrgrundgrafiken sind besser direkt in den Inhaltselementen ausgehoben. Beispielsweise aus den Grafiken "bild1", "bild2" und "toporange2" machst du ein einziges Bild, welches du als Hintergrund Grafik auf "main" setzt.

Wenn das alles erledigt ist können wir weitersehen...

Robin

__________________
CSS-Rauch! Nicht einatmen!

Schließe mich in allen Punkten an, gebe aber noch hinzu:

Den Content würde ich auch floaten, damit man innerhalb desselben uneingeschränkt clearen kann (Stichwort "Block Formatting Context"), denn andernfalls rutscht des clearende Element innerhalb von Content unter die Sidebars. Außerdem erspart man sich so den 3px-Hack für den IE < 7.

So,
Rotaro war mal wieder schneller!

Mein Tipp: Fang noch mal komplett von vorne an.
Damit du nicht ins kalte Wasser geworfen wirst habe ich mal auf die schnelle ein Template gebastelt.

Das findest du hier: www.info-fibromyalgie.de
Und als zip-Datei hier: test.zip

Das ist nur das Grundgerüst, den Rest überlasse ich dir.

EDIT:
Klappt bei mir im IE6, IE7, FF, Opera und Safari/Win beta3.03

__________________
Gruss Dieter

Vegetarier essen meinem Essen das Essen weg.
Und unsere Norweger sind reine Karnivoren.

selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS

Wow,

vielen Dank für die Antworten. Da fühlt man sich gleich richtig gut aufgehoben.

Irgendwie habe ich auch nicht erwartet, dass es gleich auf Anhieb klappt. Wahrscheinlich stecke ich mit meinem Kopf immer noch im "<table>-wirrwarr" von 1999. Werde mich also noch mal dransetzen müssen - habe ja schließlich ab nächste Woche Urlaub. Wofür sollte man ihn denn sonst nutzen

Liebe Grüße

Jan

P.S. Danke für das template. Wird mir sicher weiterhelfen!!!

Jo,
hoffe ich doch

__________________
Gruss Dieter

Vegetarier essen meinem Essen das Essen weg.
Und unsere Norweger sind reine Karnivoren.

selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS