DomPDF table 固定列宽并打断长文本

Question

我有一个 table 文本很长而且没有空格（用户喜欢 post 完整的网站 URL 包含所有参数）

然后我在每个 <td> 上设置了 word-break:break-all; 和 word-wrap:break-word;，希望文本可以适合 table。

我还将所有 <td> / 列宽设置为某个指定的量。

我在这里使用 Laravel 的 DomPDF 包装器：https://github.com/barryvdh/laravel-dompdf

案例一：否table-layout: fixed

<table class="bordered">
    <tr class="font-12">
        <th style="width: 25px">No</th>
        <th style="width: 100px">Nama Alat</th>
        <th style="width: 25px">Jml</th>
        <th style="width: 300px">Spesifikasi</th>
        <th style="width: 300px">Supplier</th>
        <th style="width: 150px">Gambar</th>
    </tr>
    @foreach ($items as $index => $item)
    <tr>
        <td style="width: 25px">{{ ($index+1) }}</td>
        <td style="width: 100px">{{ $item['name'] }}</td>
        <td style="width: 25px">{{ $item['jumlah_disetujui'] }}</td>
        <td class="font-12" style="width: 300px; word-break:break-all; word-wrap:break-word;">
            {!! nl2br( $item['spesifikasi'] ) !!}
        </td>
        <td class="font-12" style="width: 300px; word-break:break-all; word-wrap:break-word;">
            {!! nl2br( $item['supplier'] ) !!}
        </td>
        <td style="width: 150px">
            @if ($item['image'])
                <img style="max-height: 125px;" src="{{ $item['image'] }}" />
            @else
                -
            @endif
        </td>
    </tr>
    @endforeach
</table>

案例 1 PDF 结果：自动换行不起作用，列宽适用于文本较少的单元格，但对文本较长的单元格（需要字-wrap).

案例 2： 添加 table-layout: fixed

<table class="bordered" style="table-layout: fixed"> <!-- only added this -->
    <tr class="font-12">
        <th style="width: 25px">No</th>
        <th style="width: 100px">Nama Alat</th>
        <th style="width: 25px">Jml</th>
        <th style="width: 300px">Spesifikasi</th>
        <th style="width: 300px">Supplier</th>
        <th style="width: 150px">Gambar</th>
    </tr>
    @foreach ($items as $index => $item)
    <tr>
        <td style="width: 25px">{{ ($index+1) }}</td>
        <td style="width: 100px">{{ $item['name'] }}</td>
        <td style="width: 25px">{{ $item['jumlah_disetujui'] }}</td>
        <td class="font-12" style="width: 300px; word-break:break-all; word-wrap:break-word;">
            {!! nl2br( $item['spesifikasi'] ) !!}
        </td>
        <td class="font-12" style="width: 300px; word-break:break-all; word-wrap:break-word;">
            {!! nl2br( $item['supplier'] ) !!}
        </td>
        <td style="width: 150px">
            @if ($item['image'])
                <img style="max-height: 125px;" src="{{ $item['image'] }}" />
            @else
                -
            @endif
        </td>
    </tr>
    @endforeach
</table>

案例 2 PDF 结果：自动换行有效，但列宽无效

我想要的是：table 具有固定宽度的列，具有有效的自动换行

在 DomPDF 上这不可能吗？
任何解决方法或 'hacks' 可以帮助实现这一目标？

或者我应该开始寻找其他/更好的 PDF 生成器？

编辑：
我还发现了很多关于此的 Github 问题，但没有修复错误的迹象

Answer 1

不是真正的 "answer"，但我的解决方案是切换到 Snappy PDF (used the Laravel Package)。
工作得很好，我什至没有更改 HTML 标记。

Answer 2

我用 table-layout:fixed 设置了宽度，效果很好

Answer 3

我遇到了同样的问题，感谢@Solonka 的回答，我解决了。

示例：

<table border="1px" style="table-layout:fixed;">
    <tr>
        <th style="width:5%;">5%</th>
        <th style="width:10%;">10%</th>
        <th style="width:25%;">25%</th>
        <th style="width:60%;">60%</th>
    </tr>
</table>

Answer 4

DomPDF 中的宽度计算有问题（td - 以毫米为单位），但功能解决方案是使用“边框框”：

*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;

DomPDF table 固定列宽并打断长文本

DomPDF table fixed column width and break long text

html

php

pdf

dompdf