Warum wird Text in Opera mit einer größeren Schriftgröße gerendert?
Ich arbeite an einer HTML-Seite, die mehr oder weniger pixelgenau sein muss, und mir ist aufgefallen, dass in Opera 10 Schriftarten größer dargestellt werden als in anderen Browsern, obwohl die Schriftgröße tatsächlich die ist gleich.
Bitte beachten Sie diese Beispielseite in Opera 10 und einen anderen Browser wie Firefox 3.6:
Alternativ ist hier ein Screenshot, der das Problem veranschaulicht:
Die roten Kästchen hinter dem Text "50px" und "46px" (beide mit der entsprechenden Schriftgröße versehen) haben beide eine Höhe von 50px.
In Firefox 3.6 reiht sich die Unterlänge des "p" in "50px" mit dem unteren Rand der roten Box dahinter. In Opera hängt der Abseiler des "p" in "50px" darunter; Es ist das "46px", das dem "50px" in Firefox besser entspricht. Das deutet darauf hin, dass Opera Schriften in der Größenordnung von 10% zu groß rendert.
Dies und das gleiche Problem mit anderem Fließtext, löst mein Seitenlayout in Opera 10 komplett aus. Bitte lassen Sie es mich wissen, wenn Sie irgendwelche Ideen haben, was das verursacht, oder zumindest wie ich es verhindern kann .
Danke!
UPDATE:
Es scheint, dass ich keine richtige Kopie von Helvetica installiert habe - ich habe es aus dem Font-Stack entfernt und habe keinen Unterschied im gerenderten Text auf meinen Testseiten gesehen.
Ich habe die Testseiten so aktualisiert, dass sie nur die generische "Sans-Serif" -Schriftart verwenden, also sehen wir hoffentlich alle dasselbe.
Interessanterweise wird die Verwendung der generischen Schriftart "Serif" in Opera und Firefox genau so angezeigt.
Könnte dieses Problem nur eine Eigenart sein, wenn Opera die generische "serifenlose" Schriftart anzeigt?
UPDATE 2:
Das könnte wichtig sein: Ich benutze Mac OS X Snow Leopard. Ich experimentiere jetzt mit anderen Schriftarten, um zu sehen, ob ich das Problem weiter isolieren kann.
UPDATE 3:
Ich habe eine andere Testseite mit Arial erstellt:
Und jetzt stimmen Opera und Firefox fast genau überein!
Ich kann wahrscheinlich mit Arial anstelle von Helvetica bei diesem Projekt davonkommen. Soweit ich weiß, habe ich eine komplette OS X -Version von Helvetica - daher kann ich mir keine Unterschiede zwischen den verschiedenen Benutzern vorstellen, die die Schriftarten auf meiner Seite sehen. Ich bleibe bei der versuchten & amp; wahrer Arial.
Was könnte das aber bedeuten - wird die standardmäßige Sans-Serif-Schriftart von OS X in Opera oder so etwas seltsam dargestellt?
8 Antworten
Ich stieß auf diesen Thread, als ich ähnliche Probleme mit Opera 11.10 unter Windows 7 x64 hatte.
Opera verwendete standardmäßig 20px als Hauptschriftgröße (statt 16px, was andere Browser verwenden). Dies blieb auch nach der Deinstallation, dem Löschen der Opera-Einstellungen und der Neuinstallation bestehen. Es stellt sich heraus, dass Opera die System-Schriftgrößeneinstellungen berücksichtigt (eingestellt unter 'Systemsteuerung \ Darstellung und Personalisierung \ Anzeige' auf Win7) für gerenderten Webseitentext während andere Browser (ich habe FF4, Chrome 11, Safari 5, IE 9 getestet) dies nicht tun. Meine Systemschriftgröße wurde auf 125% festgelegt, was die 20px erklärt. Sobald ich meine Systemschrift auf 100% eingestellt habe, verhält sich Opera genauso wie die anderen.
Ich bin mir nicht sicher, welches Verhalten richtiger ist (In gewisser Weise ist es schön, dass Opera meine Schriftwahl respektiert), aber da andere Browser nicht dasselbe tun, ist es "unerwartet". Ich habe keinen Mac zum Testen, aber vielleicht hat MacOS eine ähnliche Systemfontpräferenz?
Ich hatte ein ähnliches Problem.
Ich habe festgestellt, dass die voreingestellte berechnete Schriftgröße in FF und den meisten anderen Browsern 16px ist, aber in der Opera scheint der Standardwert 20px zu sein.
Ich stelle einfach die Schriftgröße ein: 16px; für HTML, und es schien sich darum zu kümmern.
Ich reproduziere dein Problem nicht. Das bekomme ich in Firefox 3.6.8 (und in Internet Explorer 8):
Ich denke, ich kenne dein Problem. Ich bekomme es in allen Browsern gleich groß (zumindest Firefox, Opera und Chrome). Ich bin mir sicher, dass dies leicht übersehen werden kann, wenn Sie nicht wissen, dass Sie oder jemand anderes dies getan hat, aber versuchen Sie, die Zoomeinstellungen in Opera zu überprüfen ... lassen Sie es mich wissen, wenn es nicht hilft und ich werde mehr daran arbeiten / p>
Dies ist, wo ein CSS-Reset-Stylesheet wirklich Dinge für Sie vereinfachen kann.
Ich hatte ähnliches Problem, bis ich CSS zurücksetzen von Eric Meyer:)