Discussion :

[saluts92]

Bonjour,

Je commence un site web mobile.
Je tiens à préciser qu'il ne s'agit pas d'un site "Responsive design" mais d'un outil supplémentaire à mon site "classique" existant qui n'aura que quelques fonctionnalités adaptés aux petits écrans.

J'ai un problème avec la taille des polices de caractères. En effet j'ai positionné le style "font-size:1em" dans mon body (donc a priori 16 px).
Je travaille donc en proportionnel.
Sur mon smartphone Samsung (android) pas de problème, mais sur l'écran du smartphone (iphone4) la taille de la police est très grosse.
QUe faut il faire pour que la taille de la police soit proportionnelle à celle du navigateur d'un iphone?

D'avance merci

[rodolphebrd]

Peut-on avoir une page en ligne ou à défaut un morceau de code ?

[saluts92]

Je viens juste de corriger mon problème

en fait c'était le :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<meta id="viewport" name="viewport" content="width=device-width" />

qui générait cette différence d'affichage, je l'ai réglé en utilisant

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<meta id="viewport" name="viewport" content="initial-scale=1.0;" />

à la place qui est de tte facon plus ingénieux (à mon sens)

[Muchos]

@saluts92:

Vous pouvez faire les deux

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

Je suis curieux: À quoi sert id="viewport" ?
Et n'oubliez pas de passer le sujet en RÉSOLU

[saluts92]

Non, justement c'est ce que j'explique

si je mets width=device-width j'ai un problème d'affichage avec iPhone (police caractère très grosse)

de plus il est plus logique de ne mettre que initial-scale=1.0 qui s'adaptera à la largeur quelque soit l'orientation du smartphone
alors qu'avec width=device-width en mode paysage c'est la largeur initial (en mode portrait)qui sera prise et non en mode paysage

[rodolphebrd]

Il vaut mieux en effet choisir une meta viewport avec initial-scale=1.0 plutôt que width=device-width.
La valeur de device-width qui change et s’adapte à l’orientation semble rester constante en portrait et en paysage chez IOS.

D'où le choix suivant :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<meta name="viewport" content="maximum-scale=1">

Je suis curieux: À quoi sert id="viewport" ?

Je n'en vois pas l'utilité non plus

[saluts92]

pour l'ID j'avoue que c un reliquat d'une ligne que j'ai copié qqe part je le laisse au cas ou il serait compris par un navigateur

[rodolphebrd]

L'attribut id ne semble pas être valide dans la balise meta

[saluts92]

je l'ai enlevé je verrai bien

mais pour info, la validation W3C passait bien avec l'ID

[Muchos]

L'attribut id ne semble pas être valide dans la balise meta

META peut contenir les attributs globaux (donc a priori ID?).

avec width=device-width en mode paysage c'est la largeur initial (en mode portrait)qui sera prise et non en mode paysage

Zut! Je n'ai jamais constaté ça

[rodolphebrd]

Muchos : effectivement les discussions et articles traitant de ce sujet ne mentionnaientt pas HTML5 mais plutôt HTML4