HTML emails doesn't display tables content in Microsoft Outlook 2010

Question

Problem: Tables content does not display properly on Desktop Microsoft Outlook 2010 and 2019. However, it looks well in other versions of Microsoft Outlook and the browser.

My snippet of code is here:

<tr>
                        <td>
                            <table role="presentation" width="100%" cellpadding="0" cellspacing="0"                          
                                style="min-width:100%; border-collapse:collapse; border:0; border-spacing:0; font-size:12px; font-family:Arial,sans-serif;">
                                <thead>
                                    <tr
                                        style="padding: 0; color: white; border: 1.2px solid rgb(90, 87, 87); background: #3d3c3b !important">
                                        <td style="padding-top: 8px; padding-bottom: 8px; text-align: center;">No.</td>
                                        <td style=" text-align: center;">Description</td>
                                        <td style=" text-align: center;">Amount (RM)</td>
                                    </tr>
                                </thead>
                                <tr
                                    style=" padding: 0; color: white; border: 1.2px solid rgb(90, 87, 87); background: #353635 !important">
                                    <td style="padding-top: 8px; padding-bottom: 8px; text-align: center;">1</td>
                                    <td style=" text-align: center;">Water bill</td>
                                    <td style=" text-align: center;">78.00</td>
                                </tr>
                                <tr
                                    style=" padding: 0; color: white; border: 1.2px solid rgb(90, 87, 87); background: #353635 !important">
                                    <td style="padding-top: 8px; padding-bottom: 8px; text-align: center;">2</td>
                                    <td style=" text-align: center;">Electricity bill</td>
                                    <td style=" text-align: center;">251.25</td>
                                </tr>
                                <tr
                                    style=" padding: 0; color: white; border: 1.2px solid rgb(90, 87, 87); background: #353635 !important">
                                    <td style="padding-top: 8px; padding-bottom: 8px; text-align: center;">3</td>
                                    <td style=" text-align: center;">Indah water bill</td>
                                    <td style=" text-align: center;">25.50</td>
                                </tr>
                                <tr
                                    style=" padding: 0; color: white; border: 1.2px solid rgb(90, 87, 87); background: #575757 !important">
                                    <th style="padding-top: 8px; padding-bottom: 8px; text-align: center;" colspan="2">
                                        Total:</th>
                                    <th style=" text-align: center;">RM 480.75</th>
                                </tr>
                            </table>
                        </td>                       
                    <tr>