Bonjour, je suis en train de crée un site pour mon projet en cours et j'ai un problème que je n'arrive pas à régler moi même. J'aimerai que mon site se redimensionne tout seul pour qu'il puisse être visible normalement sur tout type d'écran.
Je m'explique, je fais mon site sur mon PC (1080p) je le regarde, tout est centré et tout est beau mais dès que je passe sur du 900p, tout est décalé.
J'ai cherché sur internet et à part le "design fluid" et des codes du style body{width:100% ; height100%} et pleins d'autres, je n'arrive pas à régler le problèmes, ça fait des heures que j'essaye les trucs avec les pourcentages, les valeurs mini et maxi en px, que ce soit sur le body, ou en div, ça ne change absolument rien, tout reste décalé en 900p.
Voila mon problème :D j'espère que vous pourrez m'aider
Déjà, est ce que tu as inseré cette balise dans le <head></head>
<meta name="viewport" content="width=device-width, initial-scale=1">
Non je ne l'ai pas fait, je dois mettre ça dans les <head> de toutes mes pages ? A quoi ça sert ?
Merci
Oui
C'est un peu complexe a explique mais en gros ca permet d'éviter d'avoir du contenu qui soit en tout petit sur mobile.
Le problème c'est vraiment le mobile ( même si c'est encore pire dessus), c'est surtout pour l'écran car le site sera PEUT ETRE utilisé par la suite donc j'aimerai qu'il soit bon partout et pas que sur du 1080p, mettre le code que tu m'as donné résoudra ce problème ou c'est surtout pour le mobile ?
Une vidéo qui explique comment on fait https://www.youtube.com/watch?v=5ZO7H-LWJ5U&index=13&list=PLGLF_Bo-Q2IykOptUyIDylNVV6F9Pfv4w
Tu as essayé bootstrap ? C'est un framework css qui gère à la perfection le responsive.
T'as juste à ajouter des class à tes blocs .
http://getbootstrap.com/css/#grid
+1 pour bootstrap
Ta casse pas la tête, avec boostrap tu as juste à rajouter une classe css aux div que tu veux ça se fait tout seul !
Sinon tu as Knack.css qui est un petit framework sympa avec des trucs préfait pour gérer le responsive entre autres !
Ça marche sur Shopify vos trucs ?
Utiliser Bootstrap est en effet une très bonne solution. Je n'ai jamais bossé avec Shopify que je ne connais donc pas du tout, mais il n'y aucune raison pour que ça ne marche pas.
Pour en revenir à ta question de base, et comme il est toujours bien de comprendre ce qu'on fait (même si tu optes pour Bootstrap), tu devrais te familiariser avec le concept de "media queries".
https://www.alsacreations.com/article/lire/930-css3-media-queries.html
Le 02 avril 2017 à 15:38:39 Slirbiflouche a écrit :
Utiliser Bootstrap est en effet une très bonne solution. Je n'ai jamais bossé avec Shopify que je ne connais donc pas du tout, mais il n'y aucune raison pour que ça ne marche pas.Pour en revenir à ta question de base, et comme il est toujours bien de comprendre ce qu'on fait (même si tu optes pour Bootstrap), tu devrais te familiariser avec le concept de "media queries".
https://www.alsacreations.com/article/lire/930-css3-media-queries.html