JSFiddle - React, Tailwind, and code Playground

HTML

<html>
  <head/>
  <body>
    <div id="mainDiv">
    
    <table id="tabMain2" style="max-height: 100px;width: 100%;background-color: #f7f7f7;border-spacing: 0;border-collapse: collapse;padding: 0"><tr><td colspan="2">
                <table style="border-spacing: 0;border-collapse: collapse;padding: 0"><tr><td>
                            <label class="boldText upperText normalText nameHeadder" style="font-weight: bold;text-transform: uppercase;font-family: Helvetica, Arial, sans-serif;font-size: 14px;line-height: 12px">
                                full name
                            </label>
                            <label class="normalText" style="font-family: Helvetica, Arial, sans-serif;font-size: 11px;line-height: 12px">
                                /
                            </label>
                            <label class="upperText normalText" style="text-transform: uppercase;font-family: Helvetica, Arial, sans-serif;font-size: 11px;line-height: 12px">
                                DEsec
                            </label>
                        </td>
                    </tr><tr><td>
                            <label class="normalText" style="font-family: Helvetica, Arial, sans-serif;font-size: 11px;line-height: 12px">
                                [email protected]
                            </label>
                            <label class="normalText" style="font-family: Helvetica, Arial, sans-serif;font-size: 11px;line-height: 12px">
                                /
                            </label>
                            <label class="normalText upperText" style="text-transform: uppercase;font-family: Helvetica, Arial, sans-serif;font-size: 11px;line-height: 12px">
                                +code-mob No
                            </label>
                        </td>
                    </tr></table></td>
        </tr><tr><td colspan="2">
                <label class="normalText" style="font-family:...