diff --git a/src/components/TeamMembers/TeamMembers.tsx b/src/components/TeamMembers/TeamMembers.tsx
index eda24ac..647314f 100644
--- a/src/components/TeamMembers/TeamMembers.tsx
+++ b/src/components/TeamMembers/TeamMembers.tsx
@@ -33,7 +33,7 @@ type VolunteerEmailProps = {
 }
 
 const VolunteerEmail: FC<VolunteerEmailProps> = withUserRole(ROLES.TEAMLEAD, ({ email }) => (
-    <div className={styles.volunteerEmail}>{email}</div>
+    <td className={styles.volunteerEmail}>{email}</td>
 ))
 
 type DaysAvailabilityProps = {
@@ -44,19 +44,15 @@ const DaysAvailability: FC<DaysAvailabilityProps> = ({ volunteer }): JSX.Element
     if (volunteer.dayWishes.length === 0) {
         return (
             <>
-                <div className={classnames(styles.day, styles.unknown)}>S</div>
-                <div className={classnames(styles.day, styles.unknown)}>D</div>
+                <td className={classnames(styles.day, styles.unknown)}>S</td>
+                <td className={classnames(styles.day, styles.unknown)}>D</td>
             </>
         )
     }
     return (
         <>
-            <div className={classnames(styles.day, hasDay("S")(volunteer) && styles.available)}>
-                S
-            </div>
-            <div className={classnames(styles.day, hasDay("D")(volunteer) && styles.available)}>
-                D
-            </div>
+            <td className={classnames(styles.day, hasDay("S")(volunteer) && styles.available)} />
+            <td className={classnames(styles.day, hasDay("D")(volunteer) && styles.available)} />
         </>
     )
 }
@@ -73,20 +69,23 @@ const TeamMembers: FC<Props> = ({ teamId }): JSX.Element => {
     if (volunteers.length === 0) return <div />
 
     return (
-        <div className={styles.volunteers}>
-            <div className={styles.volunteerName} />
-            <div className={styles.dayTitle}>S ({volunteers.filter(hasDay("S")).length})</div>
-            <div className={styles.dayTitle}>D ({volunteers.filter(hasDay("D")).length})</div>
+        <table className={styles.volunteers}>
+            <tr>
+                <th className={styles.volunteerName}>Volontaires</th>
+                <th className={styles.dayTitle}>S ({volunteers.filter(hasDay("S")).length})</th>
+                <th className={styles.dayTitle}>D ({volunteers.filter(hasDay("D")).length})</th>
+                <th>@</th>
+            </tr>
             {volunteers.map((volunteer) => (
-                <>
-                    <div key={volunteer.id} className={styles.volunteerName}>
+                <tr key={volunteer.id}>
+                    <td className={styles.volunteerName}>
                         {volunteer.firstname} {volunteer.lastname}
-                    </div>
+                    </td>
                     <DaysAvailability volunteer={volunteer} />
                     <VolunteerEmail email={volunteer.email} />
-                </>
+                </tr>
             ))}
-        </div>
+        </table>
     )
 }
 
diff --git a/src/components/TeamMembers/styles.module.scss b/src/components/TeamMembers/styles.module.scss
index 4a1f350..5756a47 100755
--- a/src/components/TeamMembers/styles.module.scss
+++ b/src/components/TeamMembers/styles.module.scss
@@ -1,24 +1,16 @@
 @import "../../theme/variables";
 @import "../../theme/mixins";
 .volunteers {
-    padding: 0;
-    list-style: none;
-}
-
-$height: 24px;
-.volunteer {
-    display: grid;
+    //display: grid;
     grid-template-columns: minmax(min-content, 5fr) min-content min-content;
 }
 
+.volunteerName {
+    grid-column: first;
+}
+
 .day {
-    display: inline-block;
-    width: 50px;
-    height: $height;
-    margin: 0 2px;
-    text-align: center;
     background-color: $color-red;
-    color: transparent;
     &.unknown {
         background-color: $color-grey-medium;
     }