Bonjour à tous,
Je créer ce sujet car je suis en train de coder un site, et je rencontre un problème que je n'arrive pas du tout à régler.
Je m'explique : j'ai commencé à coder mon site et à le prévisualiser sur Google Chrome, j'ai donc adapté mes valeurs en fonction de ce navigateur. Or, quand j'ouvre mon site avec un autre navigateur (Opéra, Firefox...), le zoom par défaut des navigateurs est différent de celui de Chrome, toute ma mise en page est donc changée et le site ne donne pas du tout pareil que sur Chrome. En effet, j'ai remarqué que le zoom par défaut de 100% de Chrome correspond environ à un zoom de 90% pour les autres navigateurs.
Voici des images pour illustrer mes propos :
La mise en page sur Chrome.
La mise en page sur Opera, on voit bien la différence de zoom.
J'ai donc cherché longtemps sur Google si il y avait un moyen pour attribuer un zoom par défaut à chaque navigateur en passant par le code mais je n'ai rien trouvé... J'ai vu que la balise meta viewport était mentionnée quelque fois, mais elle est utilisée surtout pour la mise en page mobile de ce que j'ai comprit, et je n'ai pas réussi à l'utiliser pour régler mon problème.
J'ai également pensé à utiliser les media queries, ce qui fonctionne, mais c'est très long, je dois réduire toutes les valeurs de 20%...
J'espère être assez clair, je ne sais pas si j'arrive à décrire correctement mon problème aha.
Je fais donc appel à la communauté pour savoir si il est possible de faire en sorte que le site s'affiche au même niveau de zoom sur tous les navigateurs.
Merci d'avance pour votre aide!
As-tu vérifié que tes navigateurs sont paramétrés à 100% de zoom ?
Je n'ai jamais rencontré ce problème...
Salut,
Il faut spécifier un initial scale via la balise meta viewport : https://developer.mozilla.org/fr/docs/Mozilla/Mobile/Balise_meta_viewport
Essais :
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
Cette balise dit au navigateur : restes sur un zoom pas défault, avec un ratio de 1, et interdit le zoom manuel.
Ton site doit être responsive pour ça :)