Partage
  • Partager sur Facebook
  • Partager sur Twitter

Problème du media query

    27 avril 2024 à 14:00:56

    Bonjour,

    J'ai repris le site re robbie lens pour faire des essaies, notamment avec les medias queries.

    J'ai ce bout de code venant des exos corrigé du cours HTML/CSS (que j'ai changé légèrement) :

    @media screen and (max-width: 996px) {
      header {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 15px;
      }
      header a {
        font-size: 2vh;
      }
    }
    Il marche très bien mais quand je change seulement le breakpoint (je met par exemple 800px à la place de 996px) les changements ne s'appliquent pas. Quand j'ajoute d'autres @media screen avec des breakpoints différents aucun ne marche.
    J'utilise VS code et j'affiche la page via google chrome.
    Avez-vous des idées d'où le problème peut venir?
    Merci. :)
    • Partager sur Facebook
    • Partager sur Twitter
      27 avril 2024 à 18:21:17

      Bonsoir, Évitez les titres de sujet avec "problème" si vous postez on se doute que vous avez un problème, l'indiquer dans le titre n'apporte aucune information quant au contenu du sujet.

      Merci d'utiliser le bouton code </> de la barre d'outil du forum pour insérer un code sur le forum.

      >> les changements ne s'appliquent pas.

      CTRL + F5 pour recharger la page sans tenir compte du cache du navigateur.

      Si le problème persiste, pourriez-vous postez le code que vous avez écrit en ayant vérifier sa syntaxe auprès du validateur (HTML et CSS) => https://validator.w3.org/

      • Partager sur Facebook
      • Partager sur Twitter
        1 mai 2024 à 16:16:08

        bonjour,

        as tu mis dans le head de ton fichier html  <metaname="viewport"content="width=device-width, initial-scale=1"> ?

        • Partager sur Facebook
        • Partager sur Twitter

        Problème du media query

        × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
        • Editeur
        • Markdown