Untitled

<header>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap-theme.min.css" integrity="sha384-6pzBo3FDv/PJ8r2KRkGHifhEocL+1X2rVCTTkUfGk7/0pbek5mMa1upzvWbrUbOZ" crossorigin="anonymous">

    <!-- Latest compiled and minified JavaScript -->
</header>


<body>


<page id="f">

 <div class="row">
     <div class="col-md-6">
         <div id="printTable" class="well">
             <div class="row">
                 <div class="col-md-6">
                     <div class="row">
                         <div class="col-md-4">
                             <img src="{{ qrcode_data_uri(url) }}" width="100">

                         </div>
                         <div class="col-md-2">
                             <p style="color:#e72d1e;font-size:12pt;margin:0 0 10px 0;padding:0;"><b>PASSEPORT</b></p>
                             <p style="color:#e72d1e;font-size:9pt;margin:0 0 10px 0;padding:0;">QUALIFICATIONS - FORMATIONS</p>
                             {% if adherent.prenom is defined %}
                                 <p style="margin:0;padding:0;font-size:10pt;">{{ adherent.prenom }}</p>
                             {% endif %}
                             {% if adherent.nom is defined %}
                                 <p style="margin:0;padding:0;font-size:10pt;">{{ adherent.nom }}</p>
                             {% endif %}
                         </div>
                     </div>

                     <div class="row" style="border-top: 2px solid black">
                         <div class="col-md-2">

                             <img style="margin-top: 1%" src="{{ logoCompany }}" alt="">
                         </div>
                         <div class="col-md-6">
                             <p style="text-align:center;font-size:12pt;padding:0;margin-top: 10%;">{{ adherent.companyEmployee.company.name }}</p>

                         </div>
                     </div>
                 </div>

                 <div style="border-left: 2px solid black" class="col-md-6">
                     <img src="{{ asset('assets_front/img/qsplus/qspluspasseport.jpg') }}" alt="">
                 </div>
             </div>


         </div>
     </div>
 </div>


</page>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<button type="button" class="print">Print!</button>

<script>
    function printData()
    {
        var divToPrint=document.getElementById("printTable");
        newWin= window.open("");
        newWin.document.write(divToPrint.outerHTML);
        newWin.print();
        newWin.close();
    }

    $('button').on('click',function(){
        printData();
    })
</script>

</body>