nicht angemeldet
img-Style vertical-align: middle wird ignoriert (Mozilla)
Hi ihr,
wieso ignoriert Mozilla auf meiner Seite http://www.assistance4all.de
die StyleSheet-Angabe vertical-align: middle? top und bottom brin-
gen das gewünschte Ergebnis, aber das kann irgendwie nicht sein!
Es geht um die Symbole vor den Links, die Formatierung dazu findet
ihr in http://asc0000.calibra-web.de/files/style.css.
Woran liegt das?
Danke für eure Hilfe,
Peter
-
Mosche
wieso ignoriert Mozilla auf meiner Seite http://www.assistance4all.de
die StyleSheet-Angabe vertical-align: middle? top und bottom brin-
gen das gewünschte Ergebnis, aber das kann irgendwie nicht sein!
Es geht um die Symbole vor den Links, die Formatierung dazu findet
ihr in http://asc0000.calibra-web.de/files/style.css.Ich seh da überhaupt keinen Unterschied. Du meinst doch diese Vierecke mit dem Häkchen darin, oder. Die sehen bei Konqueror und Mozilla gleich aus.
Tschö Matti
-
Hi,
wieso ignoriert Mozilla auf meiner Seite http://www.assistance4all.de
die StyleSheet-Angabe vertical-align: middle? top und bottom brin-
gen das gewünschte Ergebnis, aber das kann irgendwie nicht sein!
Es geht um die Symbole vor den Links, die Formatierung dazu findet
ihr in http://asc0000.calibra-web.de/files/style.css.Ich seh da überhaupt keinen Unterschied. Du meinst doch diese Vierecke mit dem Häkchen darin, oder. Die sehen bei Konqueror und Mozilla gleich aus.
Ja, die meine ich ... komisch. Hat hier jmd. Windows-Mozilla und
könnte das mal testen? Sind nur ca. 3px Unterschied, man muss also
genau hingucken!Danke für eure Hilfe,
Peter-
Hallo !
Ja, die meine ich ... komisch. Hat hier jmd. Windows-Mozilla und
könnte das mal testen?Ja, hab' ich!
Sind nur ca. 3px Unterschied, man muss also
genau hingucken!Ich seh' trotzdem nix.
Wenn ich mich nicht verguckt habe, haben diese Bilder eine Höhe von 17px und liegen in Textzeilen, die eine line-height von ebenfalls 17px haben.
Was gibt es da zu zentrieren?
Bei höheren Textzeilen funktionierte die vertikale Ausrichtung der Bilder bei meinen Tests wie gewünscht.
Eventuell (hab' ich jetzt nicht probiert) haben die Bilder noch einen Außenabstand, der, weil nicht anders definiert, "per default" von Browser zu Browser anders gesetzt wird. Vielleicht hilft dann ein
img { margin-top:0; margin-bottom:0; }
weiter?
Nur: Wie gesagt, ich sehe ohnehin keinen Unterschied.
Aber du hast die jüngeren Augen. :-)
Gruß,
kerki
-
Hi,
Wenn ich mich nicht verguckt habe, haben diese Bilder eine Höhe von 17px und liegen in Textzeilen, die eine line-height von ebenfalls 17px haben.
Was gibt es da zu zentrieren?
Du hast zwar Recht mit den 17px, aber normalerweise wird an der
Grundlinie ausgerichtet, und die Schrift ist nur 11px hoch. D.h.
also, dass oben und unten nochmal 3px Abstand verteilt werden.
Wenn man jedoch das Bild nicht zentriert, wird oben die Zeile
nochmal um 3px vergrößert - verstehst du?Bei höheren Textzeilen funktionierte die vertikale Ausrichtung der Bilder bei meinen Tests wie gewünscht.
???
Eventuell (hab' ich jetzt nicht probiert) haben die Bilder noch einen Außenabstand, der, weil nicht anders definiert, "per default" von Browser zu Browser anders gesetzt wird. Vielleicht hilft dann ein
img { margin-top:0; margin-bottom:0; }
weiter?
Weiß ich nicht, eigtl. ist da kein margin drum, aber ich werd's
gleich mal testen.Nur: Wie gesagt, ich sehe ohnehin keinen Unterschied.
Aber du hast die jüngeren Augen. :-)
;-) Wie alt bist du eigentlich?
Danke für deine Hilfe,
Peter-
Hi kerki,
Eventuell (hab' ich jetzt nicht probiert) haben die Bilder noch einen Außenabstand, der, weil nicht anders definiert, "per default" von Browser zu Browser anders gesetzt wird. Vielleicht hilft dann ein
img { margin-top:0; margin-bottom:0; }
weiter?
Weiß ich nicht, eigtl. ist da kein margin drum, aber ich werd's
gleich mal testen.Nein, hilft nicht.
Vielleicht siehst du ja den Unterschied, wenn du mal
http://asc0000.calibra-web.de/ und
http://asc0000.calibra-web.de/?top=1 vergleichst.
Du kannst dann ja mal die Zeilen markieren, dann siehst du, ob das
obere Ende genau so hoch wie die Zeile endet.BTW: Ist es möglich, dass das nur hier auf meinem Rechner so ist?
Ist zwar unwahrscheinlich, aber doch denkbar, oder nicht?Danke für deine Hilfe,
Peter-
Hallo !
Ich habe mir die Sache jetzt noch einmal sehr ausführlich angesehen.
Vielleicht siehst du ja den Unterschied, wenn du mal
http://asc0000.calibra-web.de/ und
http://asc0000.calibra-web.de/?top=1 vergleichst.Ja, diesen Unterschied sehe ich deutlich. Allerdings hast du auch gefudelt. Im ersten Fall hast du kein 'vertical-align' festgelegt, wodurch der default-Wert: 'baseline' angenommen wird. Hierdurch wird scheinbar die gesamte Zeile höher als per 'line-height' ursprünglich festgelegt.
Dies ist irgendwo nachvollziehbar: Wenn ich den Begriff 'baseline' richtig verstanden habe, ist dies die Unterkante der Buchstaben ohne Unterlängen (also A, b, c d etc. aber nicht g, j, p, q etc.). Bei wieviel px diese jetzt allerdings bei font-size: 11px liegt, weiß ich nicht. Selbst wenn sie bei 11px läge und ich ein Bild von 17px darauf setzte, wäre die Zeile somit höher als geplant.
Es ging aber um einen Unterschied zwischen 'vertical-align:top/bottom/middle' innerhalb einer Zeile, die genau so hoch ist wie das Bild selbst. Dieser Unterschied scheint mir wesentlich geringer, auch wenn er definitiv da ist und auch nicht weg gehen will. :-(
100% schlau werde ich aus der Spezifikation zu "vertical-align:middle" ohnehin nicht:
"Align the vertical midpoint of the box with the baseline of the parent box plus half the x-height of the parent."
(Quelle: http://www.w3.org./TR/CSS2/visudet.html#propdef-vertical-align)Wer oder was ist hier mit 'x-height' gemeint?
Ich könnte mir durchaus vorstellen, dass es hier bei kleinen Größen (11px, 17px) zu Rundungsfehlern kommen könnte. Die minimalen Unterschiede, die ich sehen konnte (1-2 px) deuten darauf hin.
In meinen Augen ist der Unterschied in der Darstellung bei 'vertical-align:middle;' aber durchaus zu verschmerzen. Bei einem direkten Vergleich mit mehreren Browsern fällt er zwar auf, aber wer guckt sich eine Webseite schon mit mehreren Browsern an? Außer uns hier! ;-)
Gruß,
kerki
P.S.: 34! :-)
-
Hi kerki,
danke für deine Antwort.Vielleicht siehst du ja den Unterschied, wenn du mal
http://asc0000.calibra-web.de/ und
http://asc0000.calibra-web.de/?top=1 vergleichst.Ja, diesen Unterschied sehe ich deutlich. Allerdings hast du auch gefudelt. Im ersten Fall hast du kein 'vertical-align' festgelegt,
Und vorhin hast du noch an meinem CSS-File rumgemeckert :)) Da
steht's drin, in ...?top=1 wird der Wert mit einem individuel-
len style-Attribut nochmal mit top überschrieben. Und da liegt
der Haken: middle wird als baseline angezeigt, und top|bottom
als middle! Ist das bei dir genauso? middle als baseline, darum
geht es!
Ich glaube nämlich, dass das bis vor ein paar Tagen noch richtig
ging, und zwar, bis ich das Menü und die Überschrift auf
position: fixed gesetzt habe. Ich habe schon getestet, beides
auf absolute zu setzen, aber das hilft nicht. Andererseits habe
ich keinen Bock, das alles wieder zurückzubasteln ... Mal gu-
cken, ob ich heute auf unserem Puretec-Account noch ein Backup
finde ...wodurch der default-Wert: 'baseline' angenommen wird. Hierdurch wird scheinbar die gesamte Zeile höher als per 'line-height' ursprünglich festgelegt.
s.o.
[...]
100% schlau werde ich aus der Spezifikation zu "vertical-align:middle" ohnehin nicht:
"Align the vertical midpoint of the box with the baseline of the parent box plus half the x-height of the parent."
(Quelle: http://www.w3.org./TR/CSS2/visudet.html#propdef-vertical-align)Wer oder was ist hier mit 'x-height' gemeint?
Keine Ahnung. Ist da vielleicht eine Skizze dabei, wo das ge-
zeigt wird?Ich könnte mir durchaus vorstellen, dass es hier bei kleinen Größen (11px, 17px) zu Rundungsfehlern kommen könnte. Die minimalen Unterschiede, die ich sehen konnte (1-2 px) deuten darauf hin.
Oder einfach, dass es an baseline und nicht middle ausgerichtet
wird, obwohl ich middle angegeben habe!!
AFAICR [1] ging das noch vor ein paar Tagen. Der IE macht's
auch richtig (komisch). Jetzt meine Frage: Wird es bei dir mit
oder ohne ?top=1 richtig angezeigt?In meinen Augen ist der Unterschied in der Darstellung bei 'vertical-align:middle;' aber durchaus zu verschmerzen. Bei einem direkten Vergleich mit mehreren Browsern fällt er zwar auf, aber wer guckt sich eine Webseite schon mit mehreren Browsern an? Außer uns hier! ;-)
Dem normalen Surfer fällt nicht der Unterschied zwischen den
beiden Browsern auf, sondern die Ausrichtung an baseline, und
die ist IMHO wirklich sehr unschön!Danke für deine Hilfe,
Peter
-
-
-
-
-
-