Partage
  • Partager sur Facebook
  • Partager sur Twitter

display:grid;

rothayato
    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
    Mewen_bzh
    • HTML / CSS
      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
      Je ne réponds pas aux messages privés.

      display:grid;

      × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
      × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
      • Editeur ●
      • Markdown