PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : "em" doch nicht schriftgrößenunabhängig?


zeckensack
2007-02-15, 07:28:47
Die verrücktesten Sachen passieren.

Zunächst mal das relevante Stückchen CSS:.navleft { color:#000; background-color:#A8F0A8; width:10em; font-weight:bold; padding:8px; }
.navleft a:link, .navleft a:visited { text-decoration:none; }
.navleft a:hover, .navleft a:active { background-color:#BCFFBC; }
.navleft ul { list-style:none; padding:0; margin-left:5px; margin-top:0px; }
.navleft a:link, .navleft a:visited, .navleft a:active { color:#000; }Man beachte insbesondere dass dieser Klasse eine Breite von 10em zugewiesen ist. Der Vollständigkeit halber: das Element ist eine Tabellenspalte (jaja, ich weiß), und keine weiteren expliziten styles (geerbt oder sonstwie) wirken darauf.

Ich wollte das mal ausprobieren weil mir auffiel dass bei mir Firefox 2.0.0.1 ganz andere Schriftarten nutzt als Opera 9.10. Bei Firefox scheinen da ein paar Systemschriftarten durchzuschlagen, während Opera für jeden Buchstaben in allen Elementen selbst die Schrift auswählt.
Die Gründe sind ja auch egal, jedenfalls habe ich in Firefox von der Tendenz her immer etwas breitere Schriften.

Ich nutze ja sehr gerne "px"-Angaben, aber damit gibt's zwei Probleme:
1)Wenn ich Elemente zu "genau" an eine Schriftart anpasse, sind sie evtl zu schmal für User mit anderen Schriftarten - klar.
2)Da Firefox nicht von Hause aus zoomen kann nutzen viele User die Einstellmöglichkeiten für die Schriftgröße um die Lesbarkeit zu erhöhen, womit auch eigentlich noch passende Layouts durcheinanderrutschen können.

Ergo ist "em", ein Maß das abhängig von der Größe der Schriftart im Elternelement ist, theoretisch die bestmögliche Größenangabe für Elemente in die ein bekannter Text gerade so hineinpassen soll.

Praktisch anscheinend doch nicht. Im Anhang seht ihr zuerst Opera, und dann Firefox. Obwohl die Schriftart in Firefox breiter ist, ist das Element schmaler. Wenn man die Schriftgröße erhöht passiert irgendwann dann noch ausgerechnet das was ja vermieden werden sollte: der Text wird abgeschnitten weil das Element nicht mehr breit genug für den Text ist; oder mit anderen Worten: die Buchstaben vergrößern sich stärker als die em-Angabe nachzieht. Ich raff's nicht.

Meinungen, Kommentare, Vorschläge, etc und so sind willkommen.

DanMan
2007-02-15, 18:28:41
Das sind ja auch garnicht die gleichen Schriftarten, wie sollen dann die Maße stimmen? Definier erstmal die Schriftart - könnte wetten, dass du das nicht gemacht hast.

Außerdem ist em noch ncie schriftartenunabhängig gewesen - genau wie ex. Das ist ja gerade das besondere daran.

darph
2007-02-15, 18:52:47
Ja, aber selbst wenn - breitere Schriftart sollte dann ja auch breiteren Container bedeuten, wenn es unterschiedliche Schriftarten sind.

Ich könnte mir aber vorstellen, daß Padding und Margin da mit rein spielen, wie die Browser das handhaben (grad beim Fux) ist ja mithin sehr abenteuerlich.

zeckensack
2007-02-16, 02:32:47
Das sind ja auch garnicht die gleichen Schriftarten, wie sollen dann die Maße stimmen? Definier erstmal die Schriftart - könnte wetten, dass du das nicht gemacht hast.

Außerdem ist em noch ncie schriftartenunabhängig gewesen - genau wie ex. Das ist ja gerade das besondere daran.Ja *seufz* dann habe ich mich eben in der Überschrift einmal zuviel verneint. Oder doch nicht? Weil das Hineinpassen einer bestimmten Menge Text in ein mittels em-Angabe festgelegtes Areal sollte in der Tat unabhängig von der Schriftgröße sein.
Ich hatt's doch genauestens erklärt ...

Das Element wird in Firefox nur noch schmaler wenn die gleiche Schriftart per CSS vorgegeben wird. Darum ging es aber nicht. Es ging darum dass die Elementbreite in Firefox nicht proportional zur Schriftgröße ist, was sie aber sein sollte.

darph,
Ich brauch aber ein bisschen Padding und Margin ;(

*fluch*

DanMan
2007-02-16, 17:19:39
Ja, aber selbst wenn - breitere Schriftart sollte dann ja auch breiteren Container bedeuten, wenn es unterschiedliche Schriftarten sind.
Nein, denn bei ems gehts darum, wie groß das große M ist. Und wie man auf den Screenshots sieht, ist das bei beiden Schriften fast gleich groß. Daher ist auch der Kasten fast gleich breit.

Die Zeichenbreite hat da überhaupt keinen Einfluss.

Kinman
2007-02-19, 19:22:49
darph,
Ich brauch aber ein bisschen Padding und Margin ;(

*fluch*


<div style="width: 200px;"
<div style="padding: 10px;">
inhalt
</div>
</div>


-> Maximale Kompatibilität beim Padding....

mfg Kinman

Gast
2007-02-21, 01:13:47
Allgemeingültiger Ratschlag: Verlink eine Seite, die das Problem zeigt und sonst nichts weiter enthält. Mit Bildschirmphotos läßt sich nicht wirklich etwas anfangen.