Veuillez vous connecter ou créer un compte pour suivre ce topic
Ce topic est suivi par: Jerem971, Swarrone
Auteur Sujet: Ma page n'est pas la même dimenssion pour tous le monde

Swarrone

Messages: 17

Bonjour, 

Alors que tous mes codes et positions sont en relatives, en envoyer mes fichiers a un ami qui as un plus grand écran que moi, je me suis aperçu que la page était trop petite pour lui .... Alors que toutes les `position:relative;` ... : /

Merci d'avance et bonne soirée 
Publicité

Jerem971

Messages: 888

Hello @Swarrone,

Normal, tu n'avais pas écouté ce que j'avais dit sur ton précédent topic 😉

Swarrone

Messages: 17

Si si sur le truc du responsive design c'est sa ?un truc comme sa 

Swarrone

Messages: 17

En fait je sais que ya un très bon tuto mais je retrouve plus le lien 'est sur un site mais je sais plus du tout

Jerem971

Messages: 888

Re:

Okay, ça vient peut-être de ce tuto ou celui-là de Jonathan 😁
Si tu comptes utiliser Bootstrap, tu as le tuto de @Clouder (mais seulement si tu comptes utiliser Bootstrap) 😉

Swarrone

Messages: 17

Si tu veux la sa fait déjà pas mal de temps que je fais tutos par tutos ou aucuns de fonctionnent, je pensait qu'en mettant tout en `relative` sa allait s'adapter aux autres écrans (sauf mobiles car je m'en fout des mobiles ...) mais a priori sa ne fonctionne pas. Chaque trucs des tutos me font perdent mon css et quand je refresh sa me met mes vieux liens html ....

Jerem971

Messages: 888

Re:

Nan c'est pas vrai ce que tu dit... Les tutos de Jonathan fonctionne parfaitement car je sais maintenant faire des sites compatibles mobiles.
Peut-être que tu te mélanges les pinceaux, tu devrais repartir de zéro je pense...
Mais montre ton code, pour que je/nous regarde/ions s'il y a des erreurs 😉

Swarrone

Messages: 17

Justement j'ai déjà refais mon site 2 fois mais c'est encore le bordel dans mes codes... 

Swarrone

Messages: 17

j'ai essayer de réorganiser tous sa mais peut etre peux tu me conseiller ?

Jerem971

Messages: 888

Re:

Sans le code, c'est un peu compliqué...
Quels tutos as-tu suivis exactement ?

Swarrone

Messages: 17

att att att celui la est très bien mais si media="screen and (max-width: 500px)" moi je veux juste que quand c'est un plus grand ecran que le mien sa affiche le css, comment je fais ?

Swarrone

Messages: 17

<!DOCTYPE html>
<html>
   <head>
      <title>ZelkorFR, site officiel</title>
      <link rel="stylesheet" media="screen and (max-width: 500px)" href="index.css">
   </head>
   <body>   
      <nav>
      <div class="bandeau"></div>
      <p class="logo">Zelkor</p>
      <p class="FR">FR</p>
      <p class="boutonAcceuil"><a href="http://localhost/zelkorfroff/index.php">Accueil</a></p>
      
      <p class="boutonForum"><a href="http://localhost/zelkorfroff/forum/forum.php">Forum</a></p>
      
      <p class="boutonBoutique"><a href="http://localhost/zelkorfroff/boutique/boutique.php">Boutique</a></p>
      
      <p class="boutonDiscord"><a href="https://discord.gg/8V2kWA9">Discord</a></p>
      <p class="boutonAbout"><a href="http://localhost/zelkorfroff/more.php">Plus d'infos</a></p>
      </nav>
      <article>
      <iframe id="video" width="952" height="535.5" src="https://www.youtube.com/embed/edYCtaNueQY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
      <div class="dégradé1"></div>
      <a class="logo-1" href="https://www.youtube.com/channel/UCEkMBIFCOgNuF3jmuSIbJqQ?view_as=subscriber"><img src="images/logo_ytb.png" border="0" width="50" height="50" alt="Chaine YouTube"></a>
      <a class="logo-2" href="https://twitter.com/ZelkorF"><img src="images/logo_twitter.png" border="0" width="50" height="50" alt="Notre Twitter"></a>
      <div class="don">Faire un don :</div>
      <form class="boutonDon" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
      <input type="hidden" name="cmd" value="_s-xclick" />
      <input type="hidden" name="hosted_button_id" value="AMC96VWLRK92E" />
      <input type="image" src="https://cdn.discordapp.com/attachments/594825416104083476/622693432351129610/fairedon.png" border="0" name="submit" title="Faites nous un don en sécuritée" alt="Bouton Faites un don avec PayPal" />
      <img alt="" border="0" src="https://www.paypal.com/fr_FR/i/scr/pixel.gif" width="1" height="1" />
      </form>
      </article>
      
   </body>
</html>

Jerem971

Messages: 888

Re:

Tout dépend de la résolution de ton écran, tu peux voir la résolution de ton écran ici.
Si tu regardes bien, en 2019, les écrans qui ont une résolution de 1366x768 et 1920x1080 sont les plus utilisés...
Après tu part du mauvais principe que tu développes pas pour mobile sachant que presque tout le monde consulte des sites sur mobile... Par exemple, ton site n'est pas compatible mobile, moi utilisateur mobile, je vais pas passer sur un PC pour visiter ton site... Et quand tu le mettras en ligne, il est pas compatible mobile bah Google te "strike" et descend ton site des résultats de recherches...
Je pense que cet article t'aidera 😉

Swarrone

Messages: 17

ok merci beaucoup je vais vraiment faire des effort de recherches sur le sujet mais pas ce soir

Bonne soirée et merci !
Publicité

Swarrone

Messages: 17

après faut savoir que mon site c'est par rapport a un serv mc donc les gens seront sur pc le plus généralement, mais il est vrai qu'on est pas a l'abri ...

Swarrone

Messages: 17

genre par exemple la : https://www.grafikart.fr/tutoriels/media-queries-responsive-178 je veux pas créer une version mobile j'aimerai bien déjà que mon site s'adapte a tous le monde ...

Jerem971

Messages: 888

Re:

Le truc c'est que la notion du Responsive Design c'est l'adaption de ton site sur tous les terminaux... Donc cela signifie que tu fais un site compatible PC/Mobiles/Tablettes...
Si tu veux rendre ton site adaptif, c'est le lien que je t'ai donné...
Pour savoir si un site est compatible mobile c'est ce lien 😉
Sinon si tu as du mal à rendre ton site responsive à la main, regarde le tuto de @Clouder 😉


Vous devez vous connecter ou créer un compte pour poster une réponse