MPDF表格列显示异常：循环生成表头与内容格式错乱

问题根源分析 #

你遇到的表格塌陷问题，本质是HTML结构碎片化导致的：浏览器对不规范的HTML容错性很高，所以echo输出时能正常显示，但mPDF的HTML解析引擎对结构完整性要求更严格。你的循环里每次迭代都生成了独立的<table>元素，第一次的table带表头，后面的是空table，再加上$data2里的</table>，最终传入mPDF的是一堆零散的、不完整的表格片段，这就导致了渲染塌陷。

修正方案 #

正确的做法是只创建一个完整的表格结构：把<table>的开始标签和表头放在循环外面，循环内部只生成表体的每行数据，最后统一闭合表格，再一次性（或逐步）传入mPDF。

修正后的代码示例 #

// 初始化完整的表格结构，包含表头
$html = '<table style="border-collapse: collapse; width: 100%; table-layout: fixed;" border="1" cellpadding="5">
            <tr>
                <td style="width: 10%; font-weight: bold;">Consolidation Month</td>
                <td style="width: 10%; font-weight: bold;">Transfer Entry No.</td>
                <td style="width: 10%; font-weight: bold;">Transfer Entry Dt.</td>
                <td style="width: 10%; font-weight: bold;">Amount</td>
                <td style="width: 10%; font-weight: bold;">Grant No.</td>
                <td style="width: 10%; font-weight: bold;">Fun Head No.</td>
                <td style="width: 10%; font-weight: bold;">Object Code</td>
                <td style="width: 10%; font-weight: bold;">Category Code</td>
                <td style="width: 10%; font-weight: bold;">UTL Trans Type</td>
                <td style="width: 10%; font-weight: bold;">UTL Dt.</td>
                <td style="width: 10%; font-weight: bold;">Utilised Amount</td>
            </tr>';

// 循环生成表体数据行
for ($i = 0; $i < $totl_rows; $i++) {
    $html .= '<tr>' 
        . '<td style="width: 10%;">' . $consolidationmonth[$i] . '</td>'
        . '<td style="width: 10%;">' . $tenumber[$i] . '</td>'
        . '<td style="width: 10%;">' . $tedate1[$i] . '</td>'
        . '<td style="width: 10%;">' . $amount[$i] . '</td>'
        . '<td style="width: 10%;">' . $grantno[$i] . '</td>'
        . '<td style="width: 10%;">' . $funcheadno[$i] . '</td>'
        . '<td style="width: 10%;">' . $objectcode[$i] . '</td>'
        . '<td style="width: 10%;">' . $categorycode[$i] . '</td>'
        . '<td style="width: 10%;">' . $utl_trans_type[$i] . '</td>'
        . '<td style="width: 10%;">' . $utl_datee[$i] . '</td>'
        . '<td style="width: 10%;">' . $utilised_amount[$i] . '</td>'
        . '</tr>';
    
    // 实时echo查看效果（可选）
    echo '<tr>' 
        . '<td style="width: 10%;">' . $consolidationmonth[$i] . '</td>'
        . '<td style="width: 10%;">' . $tenumber[$i] . '</td>'
        . '<td style="width: 10%;">' . $tedate1[$i] . '</td>'
        . '<td style="width: 10%;">' . $amount[$i] . '</td>'
        . '<td style="width: 10%;">' . $grantno[$i] . '</td>'
        . '<td style="width: 10%;">' . $funcheadno[$i] . '</td>'
        . '<td style="width: 10%;">' . $objectcode[$i] . '</td>'
        . '<td style="width: 10%;">' . $categorycode[$i] . '</td>'
        . '<td style="width: 10%;">' . $utl_trans_type[$i] . '</td>'
        . '<td style="width: 10%;">' . $utl_datee[$i] . '</td>'
        . '<td style="width: 10%;">' . $utilised_amount[$i] . '</td>'
        . '</tr>';
}

// 闭合表格
$html .= '</table>';

// 一次性写入完整的表格HTML到mPDF
$mpdf->WriteHTML($html);

额外说明 #

• 这样做的核心是保证传入mPDF的是一个完整、结构规范的元素，而不是多个零散的表格片段。
• 如果数据量极大需要分批次写入，也可以在循环里逐步添加行到$html变量，最后统一闭合并写入，效果一致。
• 保留border-collapse: collapse和table-layout: fixed样式，能进一步确保表格在mPDF中渲染的一致性。

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