"konstante" Schriftgrößen bei Formatwechsel (HTML5 und CSS3)

  • Hallo Website-Entwickler,


    basierend auf der Responsive-Version des einspaltigen Layouts von den DVDs baue ich gerade meine Homepage neu auf.
    Dabei bin ich auf folgendes Phänomen bei mobile-devices gestoßen:


    Ändert sich das Bildschirmformat, z.B. durch kippen des Displays, von Hoch- zu Querformat, Behalten Überschriften (h1, h2, h3, ...) optisch ihre Schriftgröße bei. Aber Absätze im article-Tag werden größer, obwohl die Schriftgrößen für alles via CSS3 fest in Pixeln vorgegeben sind. :?:
    Das macht natürlich die Optik der gesammten Seite kaputt, wenn normaler Text plötzlich so groß wie Überschriften, oder sogar noch größer ist.


    Was muss getan werden, um das zu vermeiden?


    Folgend die relevanten Auszüge aus den Dateien:




    An dieser Stelle schonmal Danke für die Hilfe.

  • Hallo


    Das liegt wahrscheinlich an deiner Viewport-Angabe


    Code
    1. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui">


    Bei solchen Problemen sollte die durch die bewährte Angabe


    Code
    1. <meta name="viewport" content="width=device-width, initial-scale=1.0">


    ersetzt werden.


    Gruss


    MrMurphy

  • Hast du den Cache gelöscht?

    Ja, das habe ich gemacht.

    Ansonsten liegt das Problem wahrscheinlich an dem Teil des HTML/CSS, den du uns vorenthälst.

    Dann hier nun der gesammte Sourcecode:



    JavaScript
    1. document.createElement("header");
    2. document.createElement("nav");
    3. document.createElement("article");
    4. document.createElement("footer");