How to create two Divs next to each other using mPDF?

Question

I have tried every type of style and could not. I want to create two columns in pdf.

   $html .= "<div class='row'>
                <span>INFORMAÇÕES DO COORDENADOR DO PROJETO</span>
                <hr></hr>
                <div>
                  <table>
                    <tbody>
                      <tr>
                        <td>Nome:</td>
                        <td>". $projeto->coordenador ."</td>
                      </tr>
                      <tr>
                        <td>CPF:</td>
                        <td>". $projeto->cpf ."</td>
                      </tr>
                      <tr>
                        <td>Sexo:</td>
                        <td>". $projeto->sexo ."</td>
                      </tr>
                      <tr>
                        <td>Telefone:</td>
                        <td>[phone],</td>
                        <td>[phone],</td>
                        <td>[phone]</td>
                      </tr>
                    </tbody>
                  </table>
                </div>
                <div>
                  <table style='padding-top: -80px; padding-left: 50%;'>
                    <tbody>
                      <tr>
                        <td>Titulação:</td>
                        <td>Mestre</td>
                      </tr>
                      <tr>
                        <td>E-mail:</td>
                        <td>". $projeto->email ."</td>
                      </tr>
                      <tr style='display:table;'>
                        <td>Link Curriculo Lattes:</td>
                        <td>". $projeto->link ."</td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>";

In the first table I did not put style. Already in the second yes. I used Padding.

style='padding-top: -80px; padding-left: 50%;'

Go down like this:

There’s a way to do that?

Answer 1

Come on,

No need to write inline css in mpdf, at the end just add:

$mpdf->WriteHTML($stylesheet, 1); // seu css
$mpdf->WriteHTML($html, 2); // seu html

I recommend testing first in html and then converting to pdf, if something comes out different in pdf see the list of supported css items in mpdf : Supported CSS Attributes

I added two classes, LEFT/RIGHT to perform this separation.

Example:

<?php

$stylesheet = ".right {
  float: right;
  width: 50%;
}

.left {
  float: left;
  width: 50%;
}
body{
   font-size:12px;
}
";


$html = "<div class='row'>
  <span>INFORMAÇÕES DO COORDENADOR DO PROJETO</span>
  <hr>
  <div class='left'>
    <table>
      <tbody>
        <tr>
          <td>Nome:</td>
          <td> PROJETO->COORDENADOR </td>
        </tr>
        <tr>
          <td>CPF:</td>
          <td> PROJETO->CPF</td>
        </tr>
        <tr>
          <td>Sexo:</td>
          <td>PROJETO->SEXO</td>
        </tr>
        <tr>
          <td>Telefone:</td>
          <td>[phone],[phone],[phone]</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div class='right'>
    <table>
      <tbody>
        <tr>
          <td>Titulação:</td>
          <td>Mestre</td>
        </tr>
        <tr>
          <td>E-mail:</td>
          <td>PROJETO->EMAIL</td>
        </tr>
        <tr>
          <td>Link Curriculo Lattes:</td>
          <td>PROJETO->LINK</td>
        </tr>
      </tbody>
    </table>
  </div>
";

include 'lib/mpdf/mpdf.php';
$mpdf = new mPDF();
$mpdf->WriteHTML($stylesheet, 1);
$mpdf->WriteHTML($html, 2);
$mpdf->Output('exemplo.pdf', 'I');

As it turned out: