Om nah hoo pez nyeetz, Moni!

Ohne in das fiddle geschaut zu haben:

Ein Browserfenster hat ja ein bestimmtes Format, ich meine damit nicht nur die Abmessungen selbst, sondern auch das Verhältnis aus Höhe und Breite.

Ich gehe jetzt mal von einem Bild aus, das breiter als hoch ist (landscape). Ich betreibe meinen Browser selten im Vollbild, dafür dürfen sich aber bei mir manchmal zwei Browserfenster den Bildschirm teilen. Ein Browserfenster ist deshalb höher als breit (portrait)

Du musst dir also zu allererst die Frage stellen, wie du verfahren möchtest, wenn das Bild vom Format her nicht passt.

• Möchtest du es verzerren? Ich denke nicht.
• Du möchtest immer die Höhe des Viewports haben. Dafür gibt es die Maßeinheit vh.
    - Soll die Originalgröße beibehalten werden und links und rechts abgeschnitten werden?
    - Soll das Bild verkleinert werden?

Am besten, du skizzierst dir mal verschiedene (Extrem-)fälle.

Je nach dem wie deine Antwort ausfällt, kann man weiter sehen.

2. Frage
Transportiert das Bild Inhalt, wie eine Illustration in einer Zeitung, ein Firmenlogo oder ein Foto eines Mitarbeiters um den es in der Seite geht?

Ist das Bild eher Verzierung oder Schmuck?

Je nach dem wie deine Antwort ausfällt, kann man weiter sehen.

PS: Bitte kein TOFU ;-)

Matthias

--
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Kant und Kantate.