Search code examples
htmlcssdompdf

How to display 2 tables side by side using css in dompdf


I try to use display inline-block but dompdf doesn't support display inline. I have here : enter image description here

using these codes:

    <div style="float: left; width: 50%;">
<table style="" border="1px solid" class="mr-3">
            <body>
                <tr>
                    <td class="pl-1">Account No</td>
                    <td class="center">:</td>
                    <td class="pl-1"><?=$client->acc_number?></td>
                </tr>
                <tr>
                    <td class="pl-1">Full Name</td>
                    <td class="center">:</td>
                    <td class="pl-1"><?=$client->fullname?></td>
                </tr>
                <tr>
                    <td class="pl-1">Contact No</td>
                    <td class="center">:</td>
                    <td class="pl-1"><?=$client->contact_num?></td>
                </tr>
                <tr>
                    <td class="pl-1">Address</td>
                    <td class="center">:</td>
                    <td class="pl-1"><?=$client->address?></td>
                </tr>
                <tr>
                    <td class="pl-1">Status</td>
                    <td class="center">:</td>
                    <td class="pl-1"><?=$client->remarks?></td>
                </tr>
            </body>
        </table>
    </div>
    <div style="float: right; width: 50%;">
<table style="" border="1px solid" class="inlineTable">
            <tbody>
                <tr>
                    <td>Date of Loan</td>
                    <td>:</td>
                    <td class="right"><?=strftime("%b. %d, %Y",strtotime($loan->date_loan))?></td>
                </tr>
                <tr>
                    <td>Term of Loan</td>
                    <td>:</td>
                    <td class="right"><?= $loan->loan_term;?> <?=$loan->loan_term == 1 ? " Month" : " Months"; ?></td>
                </tr>
                <tr>
                    <td>End of Loan</td>
                    <td>:</td>
                    <td class="right"><?= strftime("%b. %d, %Y",strtotime($loan->loan_end))?></td>
                </tr>
                <tr>
                    <td>Collection</td>
                    <td>:</td>
                    <td class="right"><?=$loan->collection?></td>
                </tr>
                <tr>
                    <td>Principal</td>
                    <td>:</td>
                    <td class="right"><?=number_format($loan->principal)?></td>
                </tr>
                <tr>
                    <td>Interest</td>
                    <td>:</td>
                    <td class="right"><?=$loan->interest?>%</td>
                </tr>
                <tr>
                    <td>Total Interest</td>
                    <td>:</td>
                    <td class="right"><?=number_format($loan->total_interest)?></td>
                </tr>
                <tr>
                    <td>Total Payment</td>
                    <td>:</td>
                    <td class="right"><?=number_format($loan->total)?></td>
                </tr>
                <tr>
                    <td>Amount of Payment</td>
                    <td>:</td>
                    <td class="right"><?=number_format($loan->payment)?></td>
                </tr>
                <tr>
                    <td>Total Paid</td>
                    <td>:</td>
                    <td class="right"><?=number_format($total_paid)?></td>
                </tr>
                <tr>
                    <td>Balace</td>
                    <td>:</td>
                    <td class="right"><?=number_format($balance)?></td>
                </tr>
            </tbody>
        </table>
    </div>

The border of the table is not following the floated div to the right. I have search a lot dompdf table problem but still don't have find any answer please help me.

The border of the table is not following the floated div to the right. I have search a lot dompdf table problem but still don't have find any answer please help me.

The border of the table is not following the floated div to the right. I have search a lot dompdf table problem but still don't have find any answer please help me.

The border of the table is not following the floated div to the right. I have search a lot dompdf table problem but still don't have find any answer please help me.

The border of the table is not following the floated div to the right. I have search a lot dompdf table problem but still don't have find any answer please help me.


Solution

  • Remove the div you use and add another table

    <table>
    <tr>
      <td> your left side table </td>
      <td> your right side table </td>
    </tr>
    </table>