JSFiddle - React, Tailwind, and code Playground

by yudizsolutions

HTML

<table cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="width: 320px; background: white;">
  <tr>
    <td>
      <hr>
    </td>
  </tr>
  <tr>
    <td><span style="font-size: 22px; font-weight: 600;">Name Nameson</span></td>
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td><span style="text-transform: uppercase; font-size: 14px;">Customer Service Manager</span></td>
  </tr>
  <tr>
    <td>
      <hr>
    </td>
  </tr>
  <tr>
    <td><span style="font-weight: 600;">P.</span>&nbsp;&nbsp;<span>07 1111 1111</span></td>
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td><span style="font-weight: 600;">M.</span>&nbsp;&nbsp;<span>0401 111 111</span></td>
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td><span style="font-weight: 600;">E.</span>&nbsp;&nbsp;<span>test@venetablinds.com.au</span></td>
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td><span style="font-weight: 600;">A.</span>&nbsp;&nbsp;<span>13/14 Argyle St, Albion QLD 4010</span></td>
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td><span style="font-weight: 600;">W.</span>&nbsp;&nbsp;<span>www.venetablinds.com.au</span>
    </td>
  </tr>
  <tr>
    <td><img src="https://drive.google.com/uc?id=1xze-aa3lvrf6Rrvl0Krb5G2sfVA2LZFm" width="320px">
  </tr>
  <tr>
    <td height="5"></td>
  </tr>
  <tr>
    <td>
      <a><img src="https://drive.google.com/uc?id=1jiViwT0NnYrNSeUbfjh1RwbyMfL4IACa"></a>
      <a><img src="https://drive.google.com/uc?id=1S1wRD6Fqx8MqDu0RlCYauhgWiBMVCLyo"></a>
      <a><img src="https://drive.google.com/uc?id=18yiUbFJ4NAapVLkMBBrAvo-HrQFNZ6-e"></a>
    </td>
  </tr>
</table>

CSS

span,
p,
td,
tr {
  color: #24406d;
  line-height: 90%;
  mso-line-height: taro-papo;
  font-family: Helvetica, Arial, sans-serif;
}