"Spalten-Layout": em vs. HG-Bild
Maik W. aus E.
"Spalten-Layout": em vs. HG-Bild
Maik W. aus E.
Tach zusammen,
Bei meinen Experimenten mit einer Spaltensimulation im CSS-Layout bin ich auf einen nervigen Anzeigefehler im IE gestoßen, zu dem ich keine rechte Lösungsidee habe. Auf meiner Testseite könnt ihr sehen, was ich meine.
Bei vergrößerter Schriftart bricht der Streifen links aus dem Bild, wie ich es gedacht habe, aufgrund der großen Schrift aus und es gibt einen unschönen Zacken im IE. Alle anderen Broswer lassen die Schrift über die sichtbare Fläche hinausgehen, was auch nicht schön, aber wesentlich erträglicher ist.
Das offensichtliche Grundproblem ist mir klar, fest definierte Breite des HG-Bildes vs. frei wachsender Breite der Schrift... Alle gefundenen Beispiele und Anwendungen haben im DIV einfach kürzere Worte, die "rechtzeitig" umbrechen, so daß da keine Problemlösung zu finden war.
Hat jemand eine Idee?
Vielen Dank für die Aufmerksamkeit,
Maik
-
hi,
Auf meiner Testseite könnt ihr sehen, was ich meine.
Bei vergrößerter Schriftart bricht der Streifen links aus dem Bild,welches bild?
ohne im CSS nachzuschauen, fällt mir da kein hintergrundbild auf.
bzw. da sehe ich nichts, was man nicht auch mit reinem CSS - rahmen und hintergrundfarben - hätte machen können.wenn du also die breite des linken bereiches ebenfalls in em angeben würdest, und für dessen grauen hintergrund die hintergrundfarbe eines alle drei bereiche umfassenden containers nimmst, sollte das problem eigentlich erledigt sein.
den rechten rahmen des linken bereiches dann als border-left des inhaltsbereiches.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Tach auch wahsaga,
Bei vergrößerter Schriftart bricht der Streifen links aus dem Bild,
welches bild?
Bild im Sinne von gestalteter Form, schöner Streifen, etc. (vielleicht eher "aus dem Rahmen"...)
ohne im CSS nachzuschauen, fällt mir da kein hintergrundbild auf.
Na ist doch schön, ist aber eins drin (150px breit, Farbe des linken Bereichs, Border li und re
bzw. da sehe ich nichts, was man nicht auch mit reinem CSS - rahmen und hintergrundfarben - hätte machen können.
wenn du also die breite des linken bereiches ebenfalls in em angeben würdest,
hatte ich erst, da blieb aber der "Spalteneffekt" auf der Strecke...
und für dessen grauen hintergrund die hintergrundfarbe eines alle drei bereiche umfassenden containers nimmst, sollte das problem eigentlich erledigt sein.
Ist es auch fast, vorher hatte der Container die Farbe von Inhalt und eben dieses Bild für den Kasten links, jetzt ist es getauscht.
den rechten rahmen des linken bereiches dann als border-left des inhaltsbereiches.
Auch nicht doof, habe ich mal ausprobiert, klappt auch fast, siehe test2.html.
Die fiesen Streifen oben und unten kriege ich noch weg, aber den Text ein bißchen vom Kasten rechts wegzukriegen, da fällt mir spontan nichts zu ein...
Danke und Gruß aus Essen
Maik
-
hi,
Auch nicht doof, habe ich mal ausprobiert, klappt auch fast, siehe test2.html.
am anfang dieses dokumentes steht:
<?
require "central.inc.php";
...solltest du zum testen auf jeden fall beseitigen, denn sonst schickst du den IE 6 in den quirks mode.
Die fiesen Streifen oben und unten kriege ich noch weg, aber den Text ein bißchen vom Kasten rechts wegzukriegen, da fällt mir spontan nichts zu ein...
gebe ihm nach links und ggf. auch noch nach unten etwas margin, das hält den text des inhaltsbereiches auf abstand.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; } -
ich nochmal,
habe gerade gesehen, daß der IE den Kasten rechts nicht richtig "umfloatet", sondern ganz im Gegenteil es so aussieht als wäre rechts ein "margin" gesetzt und deswegen die Hintergrundfarbe des allumfassenden Containers durchkommt...
Damit ist nichts gewonnen, denn das ist ja noch häßlicher als ein gelegentlicher Zacken links...Hat jemand kreativen Input für mich?
Danke und Gruß aus Essen
Maik
-
hi,
habe gerade gesehen, daß der IE den Kasten rechts nicht richtig "umfloatet"
wie ich schon sagte, bitte erst mal den ungeparsten PHP-teil aus dem dokument entfernen.
ausserdem ist deine doctype-angabe noch fehlerhaft, da hat sich ein anführungszeichen zu viel eingeschlichen.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Tach auch wahsaga,
wie ich schon sagte, bitte erst mal den ungeparsten PHP-teil aus dem dokument entfernen.
Der war da schon weg, aber
ausserdem ist deine doctype-angabe noch fehlerhaft, da hat sich ein anführungszeichen zu viel eingeschlichen.
Das war der Punkt!
Jetzt sieht es gut aus, auch wenn der Text nicht wirklich fließt, damit müssen IE-Benutzer halt leben, Hauptsache, die Fächen sind schön.
Danke!
Maik
-
ich schon wieder...
ausserdem ist deine doctype-angabe noch fehlerhaft, da hat sich ein anführungszeichen zu viel eingeschlichen.
Das war der Punkt!Eben nicht! Tipfehler und ungeparstes PHP entfernt, der graue Streifen rechts bleibt im IE...
Elende Falsch-Tipperei. Die test3.html hat das falsch CSS gezogen, bei der Kontrolle ist aufgefallen, daß das Problem immer noch besteht.
Gibt es irgendeinen "Hack", der dem IE beibiegt, gescheit zu floaten?
Danke!
Maik
-
-
-
-
-