JSFiddle - React, Tailwind, and code Playground

by Deka

HTML

<table id="tbl_wpr">
    <tr>
        <td>
            <!-- START OF CONTENT TABLE -->
            <table id="tbl_content">
                <tr>
                    <td class="user-wpr">
                        Hi <span class="user">Deqaa</span>,
                    </td>
                </tr>
                <tr>
                    <td>
                        <p>
                        Terima kasih telah mengajukan perbaikan gadget Anda di ZFix. Gadget Anda dengan nomor perbaikan <span class="trx-no">BF00201</span> sudah kami terima dan akan diperbaiki secepatnya. Anda akan menerima email pemberitahuan selanjutnya sesudah gadget Anda kami perbaiki.
                        </p>
                    </td>
                </tr>
                <tr>
                    <td class="faq">
                        <p class="subtitle">
                        Tidak pernah mengajukan perbaikan?
                        </p>
                        <p class="desc">
                        Apabila Anda tidak pernah melakukan pengajuan perbaikan dengan nomor perbaikan <span class="trx-no">BF00201</span>, mohon hubungi customer service kami dan kami akan melakukan pengecekan terkait atas permintaan pengajuan ini.
                        </p>
                    </td>
                </tr>
            </table>
            <!-- END OF CONTENT TABLE -->
        </td>
    </tr>
</table>

CSS

p, ul, li, div, span, table, tr, td {
    font-family : Avenir,Helvetica,sans-serif;
    font-size : 16px;
    color: #5d5d5d;
}
a {
    color: #0000EE:
}
ul {
    list-style-type : none;
    margin : 0;
    padding : 0;
}
table {
    width: 100%;
    margin: 0;
    padding : 0;
    border-collapse: collapse;
}

table td {
    padding : 50px 30px 30px 30px;
}
table table {
    border: 0;
}
table table td {
    border : 0;
}

#tbl_wpr {
    margin: 0 auto;
    border-top : 5px solid #3153A4;
    border-right : 1px solid #EDEDED;
    border-bottom : 1px solid #EDEDED;
    border-left : 1px solid #EDEDED;
}

p {
    line-height: 1.65;
}

.subtitle {
    font-weight : bold;
    margin-bottom : 10px;
}

.desc {
    margin-top: 0px;
}

.trx-no {
    font-weight : bold;
    color : #3153A4;
}
#tbl_content td {
    padding : 0;
}
#tbl_content td.user-wpr {
    padding : 0 0 20px;
	font-size : 18px;
}
#tbl_content td.user-wpr .user {
	font-weight : bold;
	font-size : 20px;
	color : #E78632;
}
#tbl_content td.faq {
    padding-top : 20px;
}