Update README.md

README.md

@@ -40,18 +40,16 @@ thumbnail: "https://huggingface.co/Mooshie/hairflap/blob/main/girl1.png"
       }
       .gallery {
         display: flex;
-        flex-wrap: nowrap;
-        overflow-x: auto;
+        flex-wrap: wrap;
+        justify-content: space-between;
         margin-top: 20px;
       }
       .image-container {
-        width: auto; /* Allow images to scale based on available space */
+        flex: 0 0 calc(30% - 10px); /* Adjust the width as needed */
+        max-width: 100%;
         cursor: pointer;
         text-align: center;
-        margin-right: 10px; /* Adjust the spacing between images */
-      }
-      .image-container:last-child {
-        margin-right: 0; /* Remove right margin for the last image */
+        margin-bottom: 20px;
       }
       .image-container img {
         width: 100%;
@@ -81,12 +79,9 @@ thumbnail: "https://huggingface.co/Mooshie/hairflap/blob/main/girl1.png"
           <img src="placeholder1.jpg" alt="Placeholder 1" loading="lazy">
         </div>
         <div class="image-container">
-          <img src="placeholder2.jpg" alt "Placeholder 2" loading="lazy">
-        </div>
-        <div class="image-container">
-          <img src="placeholder3.jpg" alt="Placeholder 3" loading="lazy">
+          <img src="placeholder2.jpg" alt="Placeholder 2" loading="lazy">
         </div>
       </div>
     </div>
   </body>
-</html>
+</html>