Michael: Anzeigeproblem (iphone), spalten werden nicht 100% angezeigt

Beitrag lesen

Ich habe ein Anzeigeproblem, das vor allem das Iphone betrifft.
Ich habe meine TestSeite in drei Bereiche

.1d1
.1d2
.1d3

eingeteilt. Jedem Bereich habe ich eine Farbe gegeben. Der Hintergrund der Seite selbst ins Schwarz.
in den Bereich id2 habe ich eine Content box integriert die zentriert erscheinen soll.
Alles funktioniert einbandfrei
.
Siehe : http://fiddle.jshell.net/cwryt7hb/5/

in Vollauflösung zum besseren Verstehen hier:

http://fiddle.jshell.net/cwryt7hb/5/show/

Aber wenn ich es mit einem Iphone betrachte, zerhaut es mir alle meine Bereiche. So als ob der Wert 100% nicht angenommen wird.

Das Ganze ist unter :

http://iphone5csimulator.com/

zu betrachten. Einfach die

http://fiddle.jshell.net/cwryt7hb/5/show/

eingeben.

Was mache ich da falsch das die Seite nicht korrekt angezeigt wird.

Vieleicht kann mal wer über meinen Code schauen und mir sagen was da schief läuft:

Michael

  
body {  
	background: #000;  
	margin:0;  
	padding:0;  
	height: 100%;  
	}  
.id1 {  
    background:#ff0000;  
    width:100%;  
    height:100px;  
}  
.id2 {  
    background:#FFF;  
    width:100%;  
    height:200px;  
}  
.id3 {  
    background:#ff0000;  
    width:100%;  
    height:200px;  
}  
  
.content {  
	margin:0 auto;  
	min-width:700px;  
	max-width:1000px;  
    height:100px;  
	padding:0 20px 0 20px;  
    background:#FFD700;  
}  
  
  

<div class="id1"></div>  
<div class="id2">  
<div class="content"></div>  
</div>  
<div class="id3"></div>