Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 01.11.2016, 12:52
berna1 berna1 ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.08.2014
Beiträge: 4
berna1 befindet sich auf einem aufstrebenden Ast
Standard Background-Images auf Mobiles werden nicht korrekt verkleinert

Hallo zusammen

Auf Mobiles werden im Portrait-Format die Hintergrundbilder meiner Seite nicht korrekt verkleinert.

Die Site ist hier Testseite.

Wenn ich im Header den Meta-Tag <meta name="viewport" content="width=device-width, initial-scale=1.0"> lösche, werden die Hintergrundbilder zwar verkleinert, aber immer noch abgeschnitten. Hier ein Printscreen

Hier etwas Code: Aus der Index die div für das HG-Bild
HTML-Code:
<div id="hintergrundbild" style="background: transparent url(img/<?PHP echo $row['bild'];?>) no-repeat center center fixed;">
Die ID aus der CSS:
Code:
#hintergrundbild {

	width: 100%;
	height:100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
Die Bilder kommen mit PHP aus der MySQL und werden mit JS eingelesen.

Was mache ich falsch?
- Müssen die Bilder in einem bestimmten Verhältnis (Breite/Höhe) sein?
- Wieso wird 'cover' nicht ausgeführt?

Kann mir jemand helfen?
Danke!!
Mit Zitat antworten
Sponsored Links