2spaltiges CSS-Layout - Text springt

[Smartiie]

Hallo,

Ich möchte eine in einem Seite im zweispaltigen CSS-Layout mit Hilfe von DIVs umsetzen. Dabei habe ich mich an folgender Vorlage orientiert:

http://de.selfhtml.org/css/layouts/mehrspaltige.htm#zweispaltig

Mein Problem: Wenn ich meine Testseite im IE öffne springt der Text am linken Rand des Content-Bereiches. D.h. dort, in der Höhe wo die Navigationsbox zuende ist springt der Text etwas nach links. Zu sehen ist das hier:

http://www.segelausflug.de/testver/

Die Layouts von selfhtml.org werden allerdings ohne diesen Sprung angezeigt. Ich habe schon überall nachgesucht, aber ich finde den Fehler nicht. Gebe ich für den Content-DIV eine feste Breite vor, ist der Sprung nicht vorhanden. Aber das ist ja nicht Sinn des flexiblen Layouts. Wer kann mir helfen? Was mache ich falsch?

(Hinweis: Wenn ich für die Navigation anstelle der DIV-Box eine Liste definiere, springt der Text bei mir ebenfalls. Daran kann es also nicht liegen.)

Für jede Info schon mal recht herzlichen Dank im Voraus.

Viele Grüße
Wulf

[Ingo Turski]

Hi,

Die Layouts von selfhtml.org werden allerdings ohne diesen Sprung angezeigt.

nö. In http://de.selfhtml.org/css/layouts/anzeige/2spaltig_links.htm ist diesen Fehler des IE bewußt noch nicht behoben, worauf explit auch hingewiesen wird:
"Im Internet Explorer werden Sie an dieser Stelle vermutlich auch einen Bug erkennen, der den neben einem floatenden Element stehenden Text zusätzlich um 3px einrückt."

Ich habe schon überall nachgesucht, aber ich finde den Fehler nicht.

Nö. Jedenfalls nicht in den folgenden Lyoutbeispielen. Dort findest Du auch eine Möglichkeit, diesen Anzeigefehler des IE zu kompensieren.

freundliche Grüße
Ingo

[Smartiie]

Hallo,

danke für die schnelle Antwort.
Ja den Hinweis habe ich übersehen. Komme aber leider trotzdem nicht weiter.

Habe ich das richtig verstanden:
Es handelt sich dabei um einen Bug im IE, der bei der Umrechnung der Maßeinheiten entseht. Wenn man die Maßeinheiten auf der Seite in EM formatiert, dann kann dieser Bug behoben werden, wenn man im Body-Tag die Schriftgröße mit "font-size:100.01" (andere sagen "100.1%") angibt.

Nun möchte ich meine Seite aber unflexibel in Pixeln formatieren.

(Ja, ich kenne die Diskussion zum Thema Barrierefreiheit und flexibel in "em" formatieren. Das ist auch in Ordnung. Ich möchte diese Diskussion hier aber nicht neu aufleben lassen. Meine Fragen richtet sich daher danach ob es eine Möglichkeit gibt, diesen Bug im IE auch mit Pixel-Formatierung zu überlisten.)

Die Formatierung von "font-size" des Body-Tags brachte weder mit "100.01%" noch mit "100.1%" Abhilfe. Evtl. ein anderer Wert o.ä.?

Kennt jemand einen Weg oder ist die einzige Möglichkeit bei fester Formatierung in Pixeln auf CSS-Layout mit DIVs zu verzichten?

Freue mich auf jede Antwort.

Viele Grüße
Wulf

[Detlef G.]

Hallo Wulf

Habe ich das richtig verstanden:

Wohl nicht, du kannst nicht alle IE-Bugs in einen Topf werfen.

Bei deinem Problem geht es um den 3-Pixel-Bug, der unabhängig von der Einheit
der Schriftgröße neben gefloateten Bereichen auftritt, und nicht um den Bug
den er bei Schriftgrößenangaben in em oder Prozent hat.

Schau dir mal ganz genau "Mehrspaltiges Layout mit Kopf- und Fußzeile" an.

Auf Wiederlesen
Detlef

[Smartiie]

Hallo,

leider habe ich trotz mehrfachen Durchschauens und ausführlichster Suche heute die Lösung nicht gefunden.

Mag sein, dass ich trotz ausführlicher Beschäftigung mit der benannten Seite doch nicht richtig geschaut oder etwas übersehen habe. Mag auch sein, dass die Lösung auf der genannten Seite in so vielen Informationen versteckt ist, dass der konkrete Punkt schwierig auszumachen ist.

Da das Problem "3-Pixel-Bug" und mögliche Lösungen dazu offensichtlich bekannt sind, würde ich mich aber über einen deutlicheren Hinweis freuen. Könnte mir vorstellen, dass eine Beschreibung der Lösung nur zwei bis drei Zeilen mehr Tipperei ist ...

Daher die Frage: Wer ist bereit über den Hinweis, dass das Osterei auf der Seite versteckt sei, hinaus ein wenig Forums-Unterstützung zu Leisten und die Lösung etwas konkreter zu formulieren. Für jede echte Hilfe ein großes Dankeschön im Voraus. (Und Ostern ist doch erst übermorgen.)

Viele Grüße
Wulf

[Ingo Turski]

Hi,

Da das Problem "3-Pixel-Bug" und mögliche Lösungen dazu offensichtlich bekannt sind, würde ich mich aber über einen deutlicheren Hinweis freuen.

Ach komm... Delefs Hinweis war deutlich genug. Folge diesem Link zu der Erklärung des Beispiels und lies dort unten unter "Erläuterung:".

freundliche Grüße
Ingo

[Smartiie]

Hallo Ingo,

danke für Deine Bemühungen.

Also: Ich stehe auf der Leitung. Und finde es nicht. Das ist eine deutliche Aussage.

Meine Frage gilt daher dem Forum: Wer kann/mag mir ohne Ostereier-Hinweis ernsthaft weiterhelfen.

Wenn Du das kannst/magst Ingo, würde ich mich natürlich freuen. Nur nachdem ich mich nun mehrere Stunden damit beschäftigt habe, wäre ich an einer ernsthaften Foren-Unterstützung interessiert. Evtl. gibt es ja auch eine Seite, die sich mit mehr als versteckten Hinweisen ausführlicher mit dem 3-Pixel-Bug beschäftigt. Auch das ist willkommen ...

Für jede ernsthafte Unterstützung und Lösung(!) nochmals ein Dankeschön im Voraus.

Viele Grüße
Wulf