JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content">
  <table id="groups">
    <thead>
      <tr>
        <th class="groupes">Groupes</th>
        <th class="action add" title="Ajouter un nouveau groupe">+</th>
      </tr>
    </thead>
    <tbody>
      <tr id="new-group-tr" style="display: none;">
        <td>
          <input type="text" id="new-group-name">
        </td>
        <td class="action add" title="Valider la création du groupe">V</td>
        <td class="action cancel" title="Annuler">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « Aucun »">
        <td class="groupes">Aucun</td>
        <td class="action delete" title="Supprimer le groupe « Aucun »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « BDES_Banque_Laydernaud »">
        <td class="groupes">Group1</td>
        <td class="action delete" title="Supprimer le groupe « BDES_Banque_Laydernaud »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « Groupe_1 »">
        <td class="groupes">Group2</td>
        <td class="action delete" title="Supprimer le groupe « Groupe_1 »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « New »">
        <td class="groupes">Group3</td>
        <td class="action delete" title="Supprimer le groupe « New »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « Test »">
        <td class="groupes">Group4</td>
        <td class="action delete" title="Supprimer le groupe « Test »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « Test 2 »">
        <td class="groupes">Group4</td>
        <td class="action delete" title="Supprimer le groupe « Test 2 »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le contenu du groupe « Test 3 »">
        <td class="groupes">Group5</td>
        <td class="action delete" title="Supprimer le groupe « Test 3 »">X</td>
      </tr>
      <tr title="Cliquer pour afficher le...

CSS

table {
  font-size: 1em;
  border-collapse: separate;
  border-spacing: 0;
  border-left: 1px solid #8080b8;
}

th {
  background-color: #a0a0d8;
  font-weight: bold;
  width: 20em;
  border-top: 1px solid #8080b8;
}

th,
td {
  padding: 2px;
  border-right: 1px solid #8080b8;
  border-bottom: 1px solid #8080b8;
}

th.action,
td.action {
  background: transparent;
  border: 0;
  width: 1em;
}