CSS skalierbares Headerbild

[Schufterle]

Hallihallo Schwarmintelligenz,
ich möchte in meinen Header ein Hintergrundbild einfügen das automatisch mitskaliert und sich ebenfalls passend einfügt.
Das Format des Bildes ist 16:9 (Auflösung 1280x720).
Die Breite des Headers ist 60% des Bodies (mittig angeordnet) bzw. der Body ist auf 60% gesetzt, was ja den Header zwingt ebenfalls diese Breite anzunehmen.
Wie kriege ich jetzt den Header dazu das Format 16:9 zu haben und das Bild so einzufügen damit es ordentlich mitskaliert?

Ich hoffe ihr könnt mir weiter helfen

Mfg, Schufterle

 

[feed3r]

So zum Beispiel:
http://www.goldenapplewebdesign.com/responsive-aspect-ratios-with-pure-css/

oder noch einfacher:
http://stackoverflow.com/questions/12991351/css-force-image-resize-and-keep-aspect-ratio

 

[Schufterle]

Mhh, der Header skaliert zwar jetzt im Seitenverhältnis, das darin enthaltene Bild allerdings nicht. Geht das Bilder skalieren eigentlich mit CSS oder muss da JavaScript ran?

Update: Habe es geschafft das sich das Bild ebenfalls im Seitenverhältnis skaliert. Allerdings ist die Navigation unter das Bilder gerutscht. Diese sollte allerdings am unteren Ende des Bilder als Overlay erscheinen.

Mfg

 

[Teisi]

Tipp: Vielleicht Container position: relative, inhalt position absolute...