index.html

@@ -16,22 +16,22 @@
 
         <div class="grille_haut"> <!-- Grille de mots --> 
             <div id="ligne1">
-                <div id="case11"></div>
-                <div id="case12"></div>
-                <div id="case13"></div>
-                <div id="case14"></div>
-                <div id="case15"></div>
+                <div id="case11">A</div>
+                <div id="case12">A</div>
+                <div id="case13">A</div>
+                <div id="case14">A</div>
+                <div id="case15">A</div>
             </div>
             <div id="ligne2">
-                <div id="case21"></div>
-                <div id="case22"></div>
+                <div id="case21">A</div>
+                <div id="case22">A</div>
                 <div id="case23"></div>
                 <div id="case24"></div>
                 <div id="case25"></div>
             </div>
             <div id="ligne3">
                 <div id="case31"></div>
-                <div id="case32"></div>
+                <div id="case32">A</div>
                 <div id="case33"></div>
                 <div id="case34"></div>
                 <div id="case35"></div>

styles.css

@@ -8,32 +8,21 @@ header{
     padding-top: 5px;
     font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
     font-size: 35px;
-    color:rgb(99, 45, 23);
-    font-weight: bold;
-}
-
-section{
-    padding-top: 5%;
-    align-items: center;
 }
 
 .grille_haut {
     display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-    
+    flex-wrap: wrap;
 }
 
 .grille_haut div {
     display: grid;
     grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
     grid-gap: 5px;
-    padding-top: 5px;
 }
 
 .grille_haut div div {
-    background-color: rgb(243, 215, 199);
+    background-color: rgb(182, 182, 182);
     border-radius: 5px;
     width: 45px;
     height: 45px;