Rounded table

by Simon Hi

HTML

<table class="table" id="global_features_wrapper">
  <tbody>
    <tr class="features_wrap" id="feature_8">
      <td>Type d'aliment</td>
      <td>
        <ul>
          <li id="value_452">Complément alimentaire</li>
        </ul>
      </td>
    </tr>
    <tr class="features_wrap" id="feature_1">
      <td>Type</td>
      <td>
        <ul>
          <li id="value_3">Foin</li>
        </ul>
      </td>
    </tr>
    <tr class="features_wrap" id="feature_2">
      <td>Poids (kg)</td>
      <td>
        <ul>
          <li id="value_468">1</li>
        </ul>
      </td>
    </tr>
    <tr class="features_wrap" id="feature_10">
      <td>Gamme</td>
      <td>
        <ul>
          <li id="value_489">Nature</li>
        </ul>
      </td>
    </tr>
    <tr class="features_wrap" id="feature_6">
      <td>Espèce</td>
      <td>
        <ul>
          <li id="value_445">Chinchilla</li>
          <li id="value_440">Cobaye</li>
          <li id="value_438">Lapin</li>
          <li id="value_446">Octodon</li>
          <li id="value_439">Cochon d'inde</li>
        </ul>
      </td>
    </tr>
    <tr class="features_wrap" id="feature_3">
      <td>Conditionnement</td>
      <td>
        <ul>
          <li id="value_5">Sachet</li>
        </ul>
      </td>
    </tr>
    <tr class="features_wrap" id="feature_7">
      <td>Âges</td>
      <td>
        <ul>
          <li id="value_447">Tous les âges</li>
        </ul>
      </td>
    </tr>
  </tbody>
</table>

CSS

#global_features_wrapper {
  border-collapse: collapse;
  background: #f3f3f3;
  border: 0.5em solid #f3f3f3;
}

#global_features_wrapper tbody {
  display: block;
  border: 0.5em solid transparent;
  background: #bdd23d;
  border-radius: 0.5em;
}

#global_features_wrapper tr:nth-of-type(2n+1) td {
  background: #fff;
}

#global_features_wrapper td {
  padding: 0.5em;
}

#global_features_wrapper td:nth-of-type(2n+1) {
  border-radius: 0.5em 0 0 0.5em;
  border-right: 0.1875em solid #2d5021;
}

#global_features_wrapper td:nth-of-type(2n) {
  border-radius: 0 0.5em 0.5em 0;
  border-left: 0.1875em solid #2d5021;
}