Bonjour je peine avec mon code css avec flexbox, je n'arrive pas à mettre les images en galerie avec des tailles identiques sans modifier la taille. Et mettre les photos en noir et blanc sauf une.
Qui peut m'aider?
Voici mon code css sur vs code : body {
max-width: 1200px;
margin: auto;
background-image:url("bg.jpg" )
}
h1 {
text-align:center;color: green;}
.galerie {
display:flex;
font-size : 20px
background-color:
flex-direction:row;
flex-grow: 1;
flex-wrap: wrap;
justify-content: center;
justify-items: center;
align-items:center;
padding: 20px 10px
width:100%;
max-width : 100%
height:auto
Object-fit: cover
}
et mon code html :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/normalize.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<style></style>
<title>Galerie des animaux de la forêt</title>
</head>
<body>
<h1>Les animaux de la forêt</h1>
<div class="galerie">
<img src="images/Biche.jpg">
<img src="images/Blaireau.jpg">
<img src="images/Ecureuil.jpg">
<img src="images/Herisson.jpg">
<img src="images/Lapin.jpg">
<img src="images/Libellule.jpg">
<img src="images/Lievre.jpg">
<img src="images/Lapin.jpg">
<img src="images/Loup.jpg">
<img src="images/loutre.jpg">
<img src="images/Lynx.jpg">
<img src="images/Mante_Religieuse.jpg">
<img src="images/Marcassin.jpg">
<img src="images/Ours.jpg">
<img src="images/OursAssis.jpg">
<img src="images/Renard.jpg">
<img src="images/Renard1.jpg">
<img src="images/Couleuvre.jpg">
<img src="images/Ecureuil.jpg">
<img src="images/Sanglier.jpg">
</div>
</body>
</html>
![[:emerveille]](https://forum-images.hardware.fr/images/perso/emerveille.gif "[:emerveille]")