Hallo, ich habe ein Foto, das horizontal mittig als Hintergrund auf dem Bildschirm angezeigt werden soll. Auf dem Hintergrund möchte ich später Buttons usw. positionieren.
Das Foto soll von der Höhe her ganz abgebildet werden. Dazu muss man es vertikal stauchen. Die Breite des Fotos muss dementsprechend angepasst werden, dass die Proportionen stimmen. Ich möchte das ganze nur mit CSS und HTML machen. Bisher sieht der Code so aus:
In Onlinehtmleditor.net sieht das zwar schon ganz gut aus, nur wenn ich rein oder rauszoome passt es nicht mehr. Die Angabe width:60% habe ich willkürlich gewählt, eigentlich wollte ich die Angabe weglassen und dachte, die Breite würde von selbst so angepasst werden, dass die Proportionen stimmen. Leider ist dem nicht so. Ich bräuchte eine dynamische Anpassung, je nachdem, welche Abmessungen das Fenster hat.
Habt ihr eine Idee und könntet mir da weiterhelfen? Danke, chrysi.
Das Foto soll von der Höhe her ganz abgebildet werden. Dazu muss man es vertikal stauchen. Die Breite des Fotos muss dementsprechend angepasst werden, dass die Proportionen stimmen. Ich möchte das ganze nur mit CSS und HTML machen. Bisher sieht der Code so aus:
Code:
<div style="text-align: center; width:100%; height:100%; background-color:green;">
<div style="text-align: left; display: inline-block; width:60%; height:100%; background-color:blue; background-image: url(http://wp.max-beckmann-schule.de/wp-content/uploads/2016/02/Seite2-Original-von-Br-unten-kurz4.gif);
background-size: cover;
">
</div>
</div>Habt ihr eine Idee und könntet mir da weiterhelfen? Danke, chrysi.
