Rahmen um automatisch skaliertes Bild

[Mr.Murphy]

Das Hauptproblem bei der Hilfe durch uns bist offensichtlich du.

Du verschweigst uns zum Einen wichtige Angaben und bist zum Anderen nicht in der Lage unsere Angaben in dein vorhandenes HTML/CSS einzufügen. Übersetzt: Dein CSS macht unser CSS "kaputt", woran wir aber nichts ändern können, da wir dein HTML und CSS nicht kennen. Wenn du uns dein HTML/CSS verheimlichst solltest du zumindest in der Lage sein, unsere Lösungen so einzufügen, dass die durch deine Angaben nicht zerstört werden.

Deine 200px Abstand oben und unten scheint die Höhe für header und footer zu sein. Woher sollen wir das wissen? Das können wir erst durch deinen Antworten vermuten.

Das Bilder über ihre Größe hinaus vergrößert werden sollen ist in der Regel auch nicht gewünscht. Dass du das wahrscheinlich trotzdem willst erschließt sich erst aus deinen Antworten.

Wo bei meiner Lösung die "roten Ränder überstehen" sollen (was immer du damit überhaupt meinst) kann ich nicht nachvollziehen.

Offensichtlich willst du ein sogenannten Holy-Grail-Layout mit einer Kopfzeile (header), einem Hauptteil (main) und einer Fußzeile (footer). In dem Hauptteil soll ein Bild die Fläche größtmöglich ausfüllen ohne selbst zu verzerren.

Dann sollten feste Höhenangaben komplett vermieden werden. Die Höhe von Kopf- und Fußzeile ergeben sich aus deren Inhalt.

Und was soll passieren, wenn der Text unter dem Foto umbricht?