5545 sujets

Sémantique web et HTML

Bonjour à vous tous,

Je sais qu'il faut ajouter ça :
<meta name="viewport" content="width=device-width, initial-scale=1">
pour que le responsive fonctionne en cas d'affichage sur un smartphone.
Par contre, ça ne fonctionne pas pour les tablettes.
J'ai cherché sur le web et j'ai trouvé ça :
<meta name="viewport" content="width=500, initial-scale=1">
mais ça ne fonctionne toujours pas. Il manque quelque chose ?

Merci pour votre aide.
Modifié par ObiJuanKenobi (04 Sep 2022 - 18:11)
Bonjour,
tu veux dire quoi "ça ne fonctionne pas" ? Tu n'as pas le responsive avec les tablettes ? Cette balise meta est sur le html, commune à tous les formats d'appareils.
Et que vient faire ce content="width=500 ?
J'ai trouvé cette ligne de code MDN :
https://developer.mozilla.org/fr/docs/Web/HTML/Viewport_meta_tag

upload/1662308074-62242-capture.png
Quand je dis que cela ne s'affiche pas, en réalité il affiche toute la page web avec évidemment de petits caractères. Voilà une capture écran en mode portrait :

upload/1662308230-62242-capture1.png
Dès que l'internaute tape l'adresse URL, je voudrais que la tablette affiche 3 colonnes au lieu de 4, pour permettre une meilleure lecture.
Modifié par ObiJuanKenobi (04 Sep 2022 - 18:21)
C'est fait en quoi, grid, flexbox ou autre ?
Pour la réponse à la question initiale du post, oui, il faut mettre cette balise aussi pour les tablettes. De toute façon, elle est en place pour tous les appareils.
Je pense que le problème de tes quatre colonnes au lieu de trois n'est pas dans la balise meta mais ailleurs. Il faudrait plus de code.
Cela fonctionne bien sur un smartphone, cela fonctionne bien aussi en mode landescape sur tablette mais pas en mode portrait sur tablette. Il m'affiche les 4 colonnes au lieu de 3.