[Résolu] Mydevice.io : demande de précisions

Bonjour,
device-width est basé sur la taille de l'écran,
width est basé sur la taille du navigateur,
avec les ratio supérieur à 1, le device-width est inférieur au width.
Ainsi pour mon LG G4 j'ai bien device-width:360px.
J'aurai besoin d'un petit éclaircissement par rapport au site
mydevices.io
on y lit que CSS width (intitulé d'une des colonnes), c'est pareil que device-width,
et on lit (par exemple pour le LG G4):
phys.width : 1440px
css.width :360px
J'aurai pensé que cela aurait du être l'inverse.
Est-ce que ce serait une erreur dans l'intitulé des colonnes (inversion ?), ou bien ai-je mal compris?
Cordialement
Modifié par cpalo (16 May 2017 - 15:28)

Hello cpalo,

"on y lit que CSS width (intitulé d'une des colonnes), c'est pareil que device-width"
> oui, en effet, la largeur CSS correspond à la valeur donnée par "device-width".

Il y a trois données différentes :
- la largeur physique, le nombre de pixel réels qui composent physiquement ton écran (ici 1440 pour le G4)
- la largeur CSS utilisable par un navigateur web, également appelée "device-width" (ici 360). Le terme de "device width" est trompeur
- la largeur de viewport ("width"), qui vaut 980px sur un android récent et qui devient la même valeur que device-width si ton site a une <meta> viewport.

L'image de mydevice.io sert d'étalon : elle mesure 320px de large et devrait occuper presque toute la largeur de ton LG G4 puisque sa largeur utilisable est de 360px.

Plus d'infos : https://www.alsacreations.com/article/lire/1490-Comprendre-le-Viewport-dans-le-Web-mobile.html
Modifié par Raphael (08 May 2017 - 20:52)