Mon entête est décalée sur iPhone et iPad

Bonjour,

j'ai un soucis avec un site sur iPhone et iPad.

Mon entête est décalée sur la gauche, je ne parvient pas à trouver pourquoi.

voir ici : http://www.lord-and-sons.com

Y a t-il une technique pour le déboggage sur iPhone et iPad ?

<div id="entete">
	<div id="entete2">
		<ul id="menu_header">
			<li>...</li>
			<li>...</li>
			<li>...</li>
		</ul>
	</div>
</div>

#entete {
margin-top: 15px;
width: 100%;
height: 142px;
line-height: 1.6em;
background: #A4B7C4 url(../images/fond-entete.jpg) top center repeat-x;
}
#entete2 {
width: 100%;
height: 100%;
background: url(../images/logo.png) center center no-repeat;
}
#entete ul#menu_header {
float: right;
padding-top: 15px;
padding-right: 20px;
}

Salut,

Et la méta viewport, c'est pour les chiens ?

Houlà, qu'est-ce que c'est que ça.
Et bien merci le prof de CSS de ne pas nous en avoir parler

Merci Victor pour la piste, je suis en train de faire mes tests

Bon ça fait un peu n'importe quoi...

Voir ici sur un iPhone : http://www.lord-and-sons.com/

Comment est-ce que je dois l'utiliser ?

La méta viewport est insérée correctement. Il ne te reste plus qu'à adapter tes feuilles de styles aux spécificités des supports mobiles. Si tu ne sais comment t'y prendre, il est alors temps de connaître les media queries, voire de t'inspirer d'une astuce de feuille de styles pour mobile.