Günter: grid area, css media query, landscape

problematische Seite

Liebes Forum,

nun wollte ich mithilfe eures Beispieles für ein Grid-Layout mit Areas einen reponsiven Auftritt für meine Webseite herstellen. Klappt am Notebook auch prima. Nur auf dem Smartphone (mit den Browsern: Standard Internet, Firefox und Chrome) bekomme ich den Wechsel in der Anzeige (von Landscape auf Portrait) nicht hin. Es soll sein, dass bei dem Wechsel auf Portrait ein 2-spaltiges Layout angezeigt wird anstelle eines 3-spaltigen. Dieser Wechsel passiert jedoch nur am Notebook, wenn ich den Rechner hochkant stelle, jedoch nicht auf dem Smartphone. Ich vermute, unzureichende Angaben bei "media" gemacht zu haben. Tests mit unterschiedlichen Angaben zu min-width brachten keinen Erfolg. Die Angaben zu landscape ebenfalls nicht. Wer kann mir einen Tipp geben, was besser wäre.

Danke!
Grüße für einen schönen Sonntag
Günter

  1. problematische Seite

    Hallo Günter,

    Wer kann mir einen Tipp geben, was besser wäre.

    Die Verwendung von landscape und portrait ist mMn nicht das, was du möchtest. Man kann auch einen 30-Zoll-Monitor hochkant stellen. Warum willst du dem dann nur eine Spalte verpassen. Orientiere dich ausschließlich an der zur Verfügung stehenden Breite.

    Bis demnächst
    Matthias

    --
    Rosen sind rot.
    1. problematische Seite

      Hallo Matthias, vielen Dank für deine schnelle Reaktion! Ich hatte es zuerst mit Angaben zur Breite gemacht. Auch die funktionieren wunderbar auf dem Notebook, jedoch nicht auf dem Smartphone. Ich kann den Viewport verkleinern und es wird auf eine 2-spaltige Anzeige gewechselt. Das interessiert jedoch keinen Browser auf dem Smartphone (Android). Daher kam ich auf die Idee mit "landscape". Was mache ich denn bei den Angaben zu min-width falsch? Oder muss ich ganz andere Abfragen wählen? Grüße Günter

      1. problematische Seite

        Hallo Günter,

        schau mal hier: https://forum.selfhtml.org/m1713543 f.

        Bis demnächst
        Matthias

        --
        Rosen sind rot.
        1. problematische Seite

          Hallo Matthias,

          vielen Dank! Ich habe nach dem Beispiel von Gunnar Bittersmann die Anzahl der Media-Abfragen erhöht und nun klappt es. Viele Grüße Günter