Tim: Bild-Höhe maximal so hoch, wie die Breite

Guten Tag,

ich möchte gerne ein Bild einblenden, was maximal quadratisch ist von der Höhe her (also max-height genau so, wie die Breite). Wenn es im Landscape-Mode ist, dann soll das Originale Seitenverhältnis beibehalten werden. Soweit so gut, das sollte ja max-height regeln. Einziges Problem, was ich sehe: Die Breite ist relativ abhängig vom darüberlegenden Element (width: 100%) und von der Bildschirmgröße (das div ist 80%). Ist das irgendwie simpel mit CSS möglich oder muss da JS genutzt werden?

Danke Euch :)

  1. Lieber Tim,

    bedeutet das, dass Du ein quadratisches Bild hast? Und von diesem quadratischen Bild willst Du in der Höhe abschneiden, was aufgrund des Viewports nicht passt?

    Oder bedeutet das, dass Du ein breites Bild hast (z.B. 16:9), bei dem Du rechts und links abschneiden möchtest, wenn es die volle Höhe anzeigt?

    Liebe Grüße,

    Felix Riesterer.

    1. Lieber Felix,

      danke für deine Antwort. Im Prinzip sollen 9:16 Bilder (also die, die höher als breit sind) quadratisch abgeschnitten werden und 16:9 Bilder komplett angezeigt werden (also ähnlich, wie bei Whatsapp).

      LG Tim