diff --git a/script.js b/script.js
index 7c602e97894c9f0e0569fe0b4fa9eed3a0d8058f..44ff9c53db2882f49303ab78431633bfc7444288 100644
--- a/script.js
+++ b/script.js
@@ -16,6 +16,23 @@ function displayPokemonList() {
         listElement.appendChild(listItem);
     });
 }
-
-// Afficher la liste au chargement de la page
 document.addEventListener("DOMContentLoaded", displayPokemonList);
+
+function displayPokemons(list) {
+    const container = document.getElementById("pokemon-list");
+    container.innerHTML = "";
+    list.forEach(pokemon => {
+        const div = document.createElement("li");
+        div.textContent = `${pokemon.name} - ${pokemon.weight}kg - ${pokemon.height}m`;
+        container.appendChild(div);
+    });
+}
+
+// Filtrage
+document.getElementById("all").addEventListener("click", () => displayPokemons(pokemons));
+document.getElementById("weight").addEventListener("click", () => {
+    displayPokemons(pokemons.filter(p => p.weight > 3));
+});
+document.getElementById("height").addEventListener("click", () => {
+    displayPokemons(pokemons.filter(p => p.height < 1));
+});
\ No newline at end of file
diff --git a/styles.css b/styles.css
index bcd560616410d5a2afeca1252bbfb66f4f10bb57..35933c7f54961a296dcc6e2760252912b41bacae 100644
--- a/styles.css
+++ b/styles.css
@@ -1,11 +1,20 @@
 body {
     font-family: Georgia, sans-serif;
+    text-align: center;
 }
 
 h1 {
     color: darkcyan;
 }
 
+button {
+    text-align: center;
+    background-color: #75a3a3;
+    border-color: #75a3a3;
+    color: white;
+    border-radius: 5px;
+}
+
 ul {
     list-style-type: none;
     padding: 0;