JSFiddle - React, Tailwind, and code Playground

by agib

HTML

<table border="1">
                  <tbody><tr>
                    <th style="width:20%">Product/Ingredient name</th>
                    <th style="width:25%">Identifiers</th>
                    <th style="width:15%">% w/w</th>
                    <th style="width:30%">Classification</th>
                    <th style="width:10%">Note</th>
                  </tr>
                  <tr>
                    <td>(±)-1-methyl-4-(1-methylvinyl)cyclohexene;trans-1-methyl-4-(1-methylvinyl)cyclohexene;(R)-p-mentha-1,8-diene;dipentene;(S)-p-mentha-1,8-diene;limonene;l-limonene;d-limonene</td>
                    <td>
                      <table>
                        <tbody><tr>
                          <td>
              CAS No.:
              5989-27-5</td>
                        </tr>
                        <tr>
                          <td>
              EC No.:
              227-813-5</td>
                        </tr>
                        <tr>
                          <td>
              REACH No.:
              01-2119529223-47-XXXX</td>
                        </tr>
                        <tr>
                          <td>
              Index No.:
              601-029-00-7</td>
                        </tr>
                      </tbody></table>
                    </td>
                    <td>95-100%</td>
                    <td>Flam. Liq. 3, H226<br>Skin Irrit. 2, H315<br>Skin Sens. 1, H317<br>Aquatic Chronic 1, H410 (M=1)<br>Aquatic Acute 1, H400 (M=1)<br></td>
                    <td></td>
                  </tr>
                </tbody></table>

CSS

.xmlPreview table[border="1"] {
    table-layout: fixed;
    margin-top: 10px;
    margin-bottom: 10px;
}