CONNEXION
  • RetourJeux
    • Tests
    • Soluces
    • Previews
    • Sorties
    • Hit Parade
    • Les + attendus
    • Tous les Jeux
  • RetourActu
    • Culture Geek
    • Astuces
    • Réalité Virtuelle
    • Rétrogaming
    • Toutes les actus
  • RetourHigh-Tech
    • Actus JVTECH
    • Bons plans
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTECH
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch
    • Xbox Series
    • Overwatch 2
    • FUT 23
    • League of Legends
    • Genshin Impact
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • PS4
  • One
  • Switch
  • Wii U
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Etoile Abonnement RSS

Sujet : Adapter son site à toutes les résolutions ?

DébutPage précedente
1
Page suivantePage suivante
Pseudo supprimé
Niveau 7
25 mars 2017 à 17:15:18

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

fazow fazow
MP
Niveau 53
25 mars 2017 à 17:58:00

Déjà, est ce que tu as inseré cette balise dans le <head></head>


<meta name="viewport" content="width=device-width, initial-scale=1">
Pseudo supprimé
Niveau 7
25 mars 2017 à 19:01:10

Non je ne l'ai pas fait, je dois mettre ça dans les <head> de toutes mes pages ? A quoi ça sert ?
Merci

fazow fazow
MP
Niveau 53
25 mars 2017 à 20:42:18

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.

Pseudo supprimé
Niveau 7
25 mars 2017 à 21:10:36

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 ?

mitwotie mitwotie
MP
Niveau 4
25 mars 2017 à 21:29:01

Une vidéo qui explique comment on fait https://www.youtube.com/watch?v=5ZO7H-LWJ5U&index=13&list=PLGLF_Bo-Q2IykOptUyIDylNVV6F9Pfv4w

Piisme Piisme
MP
Niveau 9
26 mars 2017 à 23:46:29

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

Message édité le 26 mars 2017 à 23:47:02 par Piisme
Catperson Catperson
MP
Niveau 10
30 mars 2017 à 20:43:40

+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 !

-Riguel- -Riguel-
MP
Niveau 46
01 avril 2017 à 12:11:05

Ça marche sur Shopify vos trucs ?

Pseudo supprimé
Niveau 1
02 avril 2017 à 15:38:39

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

-Riguel- -Riguel-
MP
Niveau 46
02 avril 2017 à 16:33:51

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

[[sticker:p/1lm9]]
DébutPage précedente
1
Page suivantePage suivante
Répondre
Prévisu
?
Victime de harcèlement en ligne : comment réagir ?
Infos 0 connecté(s)

Gestion du forum

Modérateurs : Thymotep
Contacter les modérateurs - Règles du forum

Sujets à ne pas manquer

La vidéo du moment