Работа с css float в html2pdf

Я использую поплавки в позиции 2 divs друг от друга.

<a href="printbox.php">print</a>
<?php ob_start(); ?>
<style>
    #sidedish{
        float: left;

        border: 1px solid black;
        width: 100px;
        height: 100px;
    }
    #maindish{
        float: right;
        width: 200px;
        border: 1px solid black;
        height: 100px;
        text-align: center;
    }

    #container{
        width: 304px;
        height: 100px;
        border: 1px solid black;
    }
</style>

<div id="container">
<div id="sidedish"></div>
<div id="maindish"><div id="box">name</div></div>
</div>
<?php $_SESSION['boxes'] = ob_get_contents(); ?>

Вот что делает printbox, он просто выводит буферизованные данные в pdf, но как-то поплавки, которые были установлены, были потеряны в процессе.

<?php require_once('html2pdf/html2pdf.class.php'); ?>
<?php
$html2pdf = new HTML2PDF('P', 'A4', 'en', true, 'UTF-8', array(0, 0, 0, 0));
$html2pdf->writeHTML($_SESSION['boxes']);

$html2pdf->Output('random.pdf');
?>

Он отлично работает на html:

enter image description here

но когда я нажимаю на печать, он обращается к этому:

enter image description here

Любая идея, в чем проблема?

Ответы

Ответ 1

Говоря о личном опыте, я бы сказал, что стиль оформления HTML2PDF - это, в лучшем случае, эзотерическая наука о черной магии. Основными причинами этого являются:

  • Класс поддерживает только (относительно небольшое) подмножество стилей и селекторов CSS
  • Совместимость CSS недокументирована
  • PDF невозможно отлаживать по отношению к вводу HTML

Чтобы быть справедливым, это не только проблема для HTML2PDF, но также для TCPDF, который HTML2PDF использует.

Возможно, что HTML2PDF, будучи просто почти нулевой настройкой, быстрый и простой альтернативный интерфейс для TCPDF, отключает поддержку CSS, но я уверен, что даже TCPDF не поддерживает float правильно.

Лучшим обходным решением, которое вы можете использовать, является отправка ваших плавающих divs в девяностые годы:

<table>
    <tr>
        <td><div class="float"> ... </div></td>
        <td><div class="float"> ... </div></td>
    </tr>
</table>

Вы также можете скрыть это смущение из общедоступного HTML:

<?php
    $isPdf = (/* condition that tells us we're outputting PDF */) ? true : false;
    if ($isPdf) {
        echo "<table><tr><td>";
    }
?>
<div class="float"> ... </div>
<?php
    if ($isPdf) { 
        echo "</td><td>";
    }
?>
<div class="float"> ... </div>
<?php
    if ($isPdf) {
        echo "</td></tr></table>";
    }
?>

Ответ 2

Вы можете увидеть оперативную документацию онлайн на французском языке здесь: http://demo.html2pdf.fr/examples/pdf/about.pdf

('Les float ne sont gérés que pour la balise IMG')

= Поплавки обрабатываются только для img-разметки классом.

Обработанные свойства css также перечислены в документе.