sebastian1986: Einheitliches Design in allen Browsern und Betriebssystemen

Hallo!

Hab mir meine eigene Seite erstellt und bin auch sehr zufrieden mit dem Design. Habe Hauptsächlich mit div-containern mit absoluter Position gearbeitet. Jetzt mein Problem:

Im Firefox und unter dem Explorer sieht die Seite perfekt aus, jedoch wenn ich die Seite mit Firefox unter Ubuntu (Linux) betrachte, ist die Schriftgröße verändert. Deshalb verzieht sich alles...(Schrift erweitert die Größe des divs und das gute Design...existiert nicht mehr...

Es liegt nich an Firefox selber, andere Seiten werden standardmäßig dargestellt.

Gibt es denn irgendetwas das ich beachten sollte bei der Wahl der Schrift, oder der Schriftgröße? Ich habe mit Dreamweaver gearbeitet und die Standardmäßig installierten Schriften verwendet, daran kanns meiner Meinung nach also nicht liegen. Die Schriftgröße wurde dann in css mit zb. 9em angepasst.

Wäre sehr nett, wenn ihr mir weiter helfen könntet! Wär echt schade wenn keine Linuxuser die Seite besuchen könnten...

Vielen Dank!

Sebastian

  1. Hallo
    Gibts Quellcode dazu? Wie formatierst du die Schrift?
    Wenn du die Schriftgrösse in Pixel angibst dürfte das eigentlich nicht passieren...

    1. [latex]Mae  govannen![/latex]

      Gibts Quellcode dazu? Wie formatierst du die Schrift?
      Wenn du die Schriftgrösse in Pixel angibst dürfte das eigentlich nicht passieren...

      Falsch.

      Lass das mal im Browser anzeigen:

      <p style="font-family: verdana; font-size: 20px;">Hallo</p>  
      <p style="font-family: 'Times New Roman'; font-size: 20px;">Hallo</p>  
      <p style="font-family: monospace; font-size: 20px;">Hallo</p>
      

      Jedes Mal 20px, und doch völlig unterschiedliche Breite. (Auf Non-Windows Systemen wird es wegen anderer Schriften noch wieder anders aussehen). Auf die Font-Rendering-Problematik wurde schon hingeweisen.

      Soll heißen: Je nachdem, welche Schriftart der Benutzer gewählt hat (und es ist möglich, auch im CSS vorgegebene Schriftartangaben per User-Stylesheet zu überschreiben) und wie der Browser diese darstellt, wird die Breite eines Textes variieren. Und deshalb gibt es für das Problem des OP:

      |Habe Hauptsächlich mit div-containern mit absoluter Position gearbeitet

      nur eine sinnvolle Lösung: Auf absolute Positionierung verzichten.

      Cü,

      Kai

      --
      Ash nazg durbatulûk, ash nazg gimbatul,ash nazg thrakatulûk, agh burzum-ishi krimpatul
      Sacrifice - the future has it's price
      And today is only yesterday's tomorrow
      selfcode sh:( fo:| ch:? rl:( br:< n4:# ie:{ mo:| va:) js:) de:> zu:) fl:( ss:| ls:?
  2. Du solltest, wenn Du absolute Zeichengrößen willst, auch absolute Zeichengrößen definieren.

    PT bezieht sich auf eine Punktgröße im Verhältnis zum Punkteraster des Monitors - wenn Dein Linux-Desktop also 90dpi vorgibt, unter Windows jedoch die standardmäßigen 75dpi verwendet werden, hast Du unterschiedlich große Schriften.

    Selbiges gilt natürlich für Prozent-Angaben bei den Schriftgrößen. Nur die Angabe in Pixeln ist wirklich pixelgenau - wobei Du berücksichtigen mußt, dass verschiedene Browser auch verschiedene Font-Renderer verwenden (man denke nur beispielsweise an Google Arora, welches Apples Webkit-HTML-Renderer mit dem Windows-Fontrenderer verbindet; Firefox unter Linux nutzt übrigens FreeType2 in Verbindung mit Pango).

    Gruß, LX

    --
    X-Self-Code: sh:( fo:) ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: Unusual
    X-Please-Search-Archive-First: Absolutely Yes
    1. Du solltest, wenn Du absolute Zeichengrößen willst, auch absolute Zeichengrößen definieren.

      PT bezieht sich auf eine Punktgröße im Verhältnis zum Punkteraster des Monitors - wenn Dein Linux-Desktop also 90dpi vorgibt, unter Windows jedoch die standardmäßigen 75dpi verwendet werden, hast Du unterschiedlich große Schriften.

      Selbiges gilt natürlich für Prozent-Angaben bei den Schriftgrößen. Nur die Angabe in Pixeln ist wirklich pixelgenau - wobei Du berücksichtigen mußt, dass verschiedene Browser auch verschiedene Font-Renderer verwenden (man denke nur beispielsweise an Google Arora, welches Apples Webkit-HTML-Renderer mit dem Windows-Fontrenderer verbindet; Firefox unter Linux nutzt übrigens FreeType2 in Verbindung mit Pango).

      Gruß, LX

      Danke für die schnelle Antwort!!!

      Also, das wirds sein, hab mich irgendwie vertan, als ich nachgelesen habe was .Xem bedeutet.

      Du hast gesagt mit Pixeln muss ich Font-Renderer beachten...
      Das sagt mir leider gar nichts... (google: ein font-renderer hat die aufgabe skalierbare schriften in pixel umzuwandeln)

      Welche Bedeutung hat das für mich? Betrifft das leute die bei ansicht eine größere ansicht als standard gewählt haben? inwiefern außert sich das negativ? was sollte ich beachten?

      Vielen Dank nochmal!

      Sebastian

      1. Der Font-Renderer ist jener Programmteil, der die Schriften, welche als größenunabhängige Daten vorhanden sind, auf die Pixelgröße bringt, welche vom Browser angefordert wird. Es gibt mehrere verschiedene Versionen, die allesamt ihre Tricks und Macken haben.

        Die Bedeutung des Font-Renderers auf die Darstellung der Schriften ist am Besten mit einem Vergleich zu erklären: Wenn Du den gleichen Text in Firefox und Safari darstellst, sieht er in Safari fettgedruckt aus und in Firefox normal.

        Das liegt daran, dass der Fontrenderer von Apple die Schriften "dicker" darstellt, als sie in Wirklichkeit sind, was dazu führen kann, dass eine Zeile in Safari umbricht, in anderen Browsern aber nicht.

        Gruß, LX

        --
        X-Self-Code: sh:( fo:) ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: Unusual
        X-Please-Search-Archive-First: Absolutely Yes