diff --git a/Front-end/src/pages/Gestion/ObjectManagement.jsx b/Front-end/src/pages/Gestion/ObjectManagement.jsx
index 513bc0c..3daf55d 100644
--- a/Front-end/src/pages/Gestion/ObjectManagement.jsx
+++ b/Front-end/src/pages/Gestion/ObjectManagement.jsx
@@ -1,15 +1,17 @@
 import React from "react";
-import { Search, ArrowRight, RadioTower,Plus } from "lucide-react";
+import { Search, ArrowRight, RadioTower, Plus } from "lucide-react";
 import { useEffect, useState } from "react";
 import axios from "axios";
 import { API_BASE_URL } from "../../config";
 import { useAuth } from "../../AuthContext";
+
 function ObjectManagement() {
   const {user} = useAuth();
   const [searchQuery, setSearchQuery] = useState("");
   const [activeFilter, setActiveFilter] = useState("");
   const [objects, setObjects] = useState([]);
-  const [nbAffObject,setnbAffObject] = useState(6);
+  const [nbAffObject, setnbAffObject] = useState(6);
+  
   const filteredDATA = objects.filter((node) => {
     const matchesSearchQuery =
       searchQuery === "" ||
@@ -30,6 +32,7 @@ function ObjectManagement() {
       setObjects(response.data);
     });
   }, []);
+  
   return (
     <div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-50">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
@@ -52,10 +55,12 @@ function ObjectManagement() {
               onChange={(e) => setSearchQuery(e.target.value)}
             />
           </div>
-          <div className="flex gap-4 mt-4 justify-center">
+          
+          {/* Filtres responsifs - utilisation de flex-wrap et responsive spacing */}
+          <div className="flex flex-wrap gap-2 mt-4 justify-center">
             <button
               onClick={() => setActiveFilter("")}
-              className={`px-4 py-2 rounded-lg ${
+              className={`px-4 py-2 rounded-lg mb-2 ${
                 activeFilter === ""
                   ? "bg-indigo-600 text-white"
                   : "bg-white text-gray-600"
@@ -65,7 +70,7 @@ function ObjectManagement() {
             </button>
             <button
               onClick={() => setActiveFilter("Station")}
-              className={`px-4 py-2 rounded-lg ${
+              className={`px-4 py-2 rounded-lg mb-2 ${
                 activeFilter === "Station"
                   ? "bg-indigo-600 text-white"
                   : "bg-white text-gray-600"
@@ -75,7 +80,7 @@ function ObjectManagement() {
             </button>
             <button
               onClick={() => setActiveFilter("Capteur")}
-              className={`px-4 py-2 rounded-lg ${
+              className={`px-4 py-2 rounded-lg mb-2 ${
                 activeFilter === "Capteur"
                   ? "bg-indigo-600 text-white"
                   : "bg-white text-gray-600"
@@ -85,7 +90,7 @@ function ObjectManagement() {
             </button>
             <button
               onClick={() => setActiveFilter("Active")}
-              className={`px-4 py-2 rounded-lg ${
+              className={`px-4 py-2 rounded-lg mb-2 ${
                 activeFilter === "Active"
                   ? "bg-indigo-600 text-white"
                   : "bg-white text-gray-600"
@@ -95,7 +100,7 @@ function ObjectManagement() {
             </button>
             <button
               onClick={() => setActiveFilter("Inactive")}
-              className={`px-4 py-2 rounded-lg ${
+              className={`px-4 py-2 rounded-lg mb-2 ${
                 activeFilter === "Inactive"
                   ? "bg-indigo-600 text-white"
                   : "bg-white text-gray-600"
@@ -105,14 +110,16 @@ function ObjectManagement() {
             </button>
           </div>
         </div>
-        <div className="grid md:grid-cols-3 gap-8">
+        
+        {/* Grille responsive pour les objets */}
+        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8">
           {filteredDATA.length === 0 ? (
-            <p>Aucun objet trouvé</p>
+            <p className="text-center col-span-full">Aucun objet trouvé</p>
           ) : (
-            filteredDATA.slice(0,nbAffObject).map((object) => (
+            filteredDATA.slice(0, nbAffObject).map((object) => (
               <div
                 key={object.id}
-                className="bg-white p-6 rounded-xl shadow-sm hover:shadow-md transition-shadow "
+                className="bg-white p-6 rounded-xl shadow-sm hover:shadow-md transition-shadow"
               >
                 {object.status === "active" ? (
                   <div className="relative w-full">
@@ -144,14 +151,21 @@ function ObjectManagement() {
             ))
           )}
         </div>
-        {(nbAffObject<filteredDATA.length)&&(
+        
+        {(nbAffObject < filteredDATA.length) && (
           <div className="flex items-center flex-col mt-6">
-            <button onClick={()=>{setnbAffObject((prev)=>prev+6 )}}><Plus size={40}/></button>
-            <label>Voir plus</label>
+            <button 
+              onClick={() => {setnbAffObject((prev) => prev + 6)}}
+              className="hover:bg-indigo-50 p-2 rounded-full transition-colors"
+            >
+              <Plus size={40} className="text-indigo-600" />
+            </button>
+            <label className="text-indigo-600 font-medium">Voir plus</label>
           </div>
         )}
       </div>
     </div>
   );
 }
-export default ObjectManagement;
+
+export default ObjectManagement;
\ No newline at end of file