求助：如何在mPDF中实现带分隔线的双栏内容流式布局

要实现内容先填满第一栏再流入第二栏、自动分页保持布局，且两栏带分隔线、内容不跨栏的效果，可利用mPDF对CSS多列布局的支持来实现，具体方案如下：

核心实现代码 #

<?php
require_once __DIR__ . '/vendor/autoload.php';

// 初始化mPDF，设置页面边距和格式
$mpdf = new \Mpdf\Mpdf([
    'format' => 'A4',
    'margin_left' => 15,
    'margin_right' => 15,
    'margin_top' => 15,
    'margin_bottom' => 15,
]);

// 带双栏样式的HTML内容
$html = '
<style>
    /* 双栏容器核心样式 */
    .two-column-container {
        columns: 2; /* 开启双栏布局 */
        column-gap: 20px; /* 两栏之间的间距 */
        column-rule: 1px solid #000; /* 两栏分隔线（粗细、样式、颜色） */
    }
    /* 内容块样式，防止跨栏 */
    .content-block {
        break-inside: avoid; /* 禁止单个内容块被拆分到两栏 */
        margin-bottom: 10px;
        padding: 8px;
    }
</style>

<div class="two-column-container">
    <!-- 示例内容块，可根据实际需求替换 -->
    <div class="content-block">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
    </div>
    <div class="content-block">
        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </div>
    <div class="content-block">
        Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
    </div>
    <!-- 可重复添加更多内容块测试自动流式和分页效果 -->
</div>
';

$mpdf->WriteHTML($html);
$mpdf->Output('two-column-document.pdf', 'I');
?>

关键参数说明 #

• columns:2：直接指定双栏布局，mPDF会自动处理内容的流式填充，第一栏填满后自动流入第二栏，整页填满后自动分页并保持双栏结构。
• column-rule：控制两栏间的分隔线，可调整为2px dashed #666这类样式，满足不同视觉需求。
• break-inside: avoid：确保每个内容块不会被拆分到两栏中，彻底避免内容跨越分隔线的情况。

注意事项 #

• 需使用mPDF 7.0及以上版本，旧版本对CSS多列布局的支持不完善。
• 若遇到内容流动异常，检查是否存在嵌套容器的样式冲突，或内容块设置了固定高度导致无法自适应流动。
• 如需自定义栏宽，可将columns:2替换为column-width: 180px，mPDF会根据页面宽度自动适配栏数。

内容的提问来源于stack exchange，提问作者Kumar Harshvardhan