I have data like this inside a div tag which i am fetching data from MySQL using PHP and populating data using a division tag like this.

Issue is that i want to print this data as the image show's but, i am not getting the desired print but i am getting print like this,

so i am trying print the div tag as image to get the print like this

**Code that i am using to print**
**print.php**
<div>
<button class="btn btn--radius-2 btn--blue" onclick="printDiv('printableTable')">Print</button>
                <div>
                    <div>
                        <div class="row" id="printableTable">
                            <?php

                            if (mysqli_num_rows($result) > 0) {
                                while ($row = mysqli_fetch_assoc($result)) {
                            ?>
                            <div class="col-md-4" style="background-color:white;height: 180px;">
                                <p>--------------------------------------------------------------</p>
                                <p><u><?php echo $row['ID'] ?></u></p>
                                <p>
                                    <b><?php echo $row['Fullname'] ?></b>
                                </p>
                                <?php echo $row['Address'] ?>
                                <p><?php echo $row['EmailId'] ?></p>
                                
                            </div>
                            <?php
                                }
                            }
                            ?>

                        </div>
**print.js**

function printDiv(divName) {
    var printContents = document.getElementById(divName).innerHTML;
    var originalContents = document.body.innerHTML;

    document.body.innerHTML = printContents;

    window.print();

    document.body.innerHTML = originalContents;
}

Any suggestions are welcome, i just need to print this full data in a single a4 sheet.