css - 在 html2pdf 中使用 css floats

Question

我正在使用 float 将 2 个 div 放置在一起。

<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，但不知何故设置的 float 在此过程中丢失了。

<?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 上工作正常:

但是当我点击打印时它变成了这个:

知道问题出在哪里吗？

Answer 1

就个人经验而言，我认为 HTML2PDF 的输出样式充其量只是深奥的黑魔法科学。主要原因是:

• 该类仅支持(相对较小的)CSS 样式和选择器子集
• CSS 兼容性未记录
• PDF 无法针对 HTML 输入进行调试

公平地说，这不仅是 HTML2PDF 的问题，也是 also for the TCPDF that HTML2PDF uses 的问题.

可能 HTML2PDF 是 TCPDF 的几乎零设置、快速简单的替代界面，关闭更多 CSS 支持 — 但我敢肯定，甚至 TCPDF 也不会正确支持 float。

您可以使用的最佳解决方法是将 float div 发送到九十年代:

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

您还可以从公共(public) 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>";
    }
?>