Partage
  • Partager sur Facebook
  • Partager sur Twitter

display:grid;

    4 février 2020 à 7:55:13

    Je viens de recommencer à coder html/css il y à quelques jours en pensant ne pas avoir oublié les astuces utiles notamment avec le display:grid; 

    Je ne vois pas l'erreur et ça me turlupine énormément.

    <!DOCTYPE html>
    <html>
    <head>
      <title>gwweg</title>
        <style type="text/css">
             
     
            .mygrid{
     
                display: grid;
                grid-template-columns: 20%, 80%;
     
            }
     
        </style>
    </head>
    <body>
     
     
        <div class="mygrid">
             
     
            <div style="background-color: red;">w</div>
            <div style="background-color: blue;">w</div>
     
     
        </div>
     
     
    </body>
    </html>

    Aucune séparation ne se fait entre les enfants de ma div en display grid, j'ai beau lire toute la docu mais rien ne me saute aux yeux.



    • Partager sur Facebook
    • Partager sur Twitter
      4 février 2020 à 8:47:07

      Bonjour,

      Pour commencer, si je regarde la doc (https://developer.mozilla.org/fr/docs/Web/CSS/grid-template-columns), je vois qu'il ne faut pas de virgule entre les deux valeurs de la propriété grid-template-columns.

      C'est d'ailleurs confirmé par le validateur CSS du W3C qui indique une erreur sur ce point.

      • Partager sur Facebook
      • Partager sur Twitter

      display:grid;

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