Ich möchte ein Bild über die unterschiedlichen Breakpoints proportional skalieren. Das ist ja an sich eigentlich nicht schwer, aber jetzt kommts!
Der “Rahmen”, in den das Bild geladen wird soll eine max. Höhe bei der Desktopdarstellung von 300px haben. In der Mobildarstellung aber nicht höher als 280px sein. Dabei soll das Bild vertikal im “Rahmen” zentriert werden und kann somit oben und unten abgeschnitten werden (nicht schlimm).
Hinzu kommt für mich erschwerend, dass die Dimensionen des Bildes nicht ausreichen, um in der Horizontalen bis an den Rand zu gehen, wenn ich z. B. die Seite auf einem 30" Bildschirm darstelle. Das Bild müsste also - unberücksichtigt der Auflösung - größer gezoomt werden als das Original.
Wie stelle ich das am besten an? Zum besseren Verständnis habe ich eine Skizze gemacht:
Danke für eure Hilfe.
Jan