1485 sujets

Web Mobile et responsive web design

Voilà mon problème, en ce moment je suis en train de faire mon site pour l'adapter sur mobile. En ce qui concerne les navigateurs sur mon ordinateur, tout ce passe à merveille. Lorsque je redimentionne la fenêtre et qu'elle va en dessous des 640px, mon autre feuille css est utilisé et tout ce passe super bien peut importe la dimention de ma fenêtre en dessous de 640px (fluide avec des widths 100%).
http://imageshack.us/photo/my-images/268/screenshot20120813at111.png/

Mais lorsque j'arrive sur mobile (test sur Ipod en ce moment), plus rien fonctionne. En fait il utilise la bonne feuille CSS mais le problème c'est qu'on dirait que le width 100% est très bas. Sur Safari le contenu est au maximum à 50px environ et sur chrome 100px, ce qui est vraiment étrange o_O.
http://imageshack.us/photo/my-images/849/photoip.png/

Ce qui «règle» le problème c'est quand j'utilise width:640px;, mais ça ne règle pas le problème et ce n'est pas polyvalent du tout....

J'utilise ce code pour lié ma feuille :
<meta name="viewport" content="width=devide-widht" />
<link rel="stylesheet" media="screen and (max-width: 640px)" href="style/smallscreen.css" type="text/css" />


EDIT : Laissé tombé, j'avais plein de faute de frappe dans Device-width XD Merci à la console d'erreur safari Smiley smile
Modifié par Flink (13 Aug 2012 - 20:02)