dompdf - 设置td width时生成空白页 - dompdf 0.6.1 v3

时间:2014-04-15 09:46:08

标签: dompdf

我试图用三个相等的列创建表

表格宽度设置为100%

当我尝试在表格上设置宽度:33%元素时,dompdf会在生成表格之前生成 1+空白页面。该表格按预期生成只有那些空白页面存在于pdf文档中。

PDF文件,宽度:33%:http://www.docdroid.net/b5cf/with-width.pdf.html

我需要在这张桌子上有相同的列,并且不能使用width =" 33%"或style =" table-layout:fixed"没有为表格提供空白页面。

HTML看起来像这样

<table class="outer_tab">
    <tbody>
        <tr class="outer_tr">
            <td valign="top" class="outer_td">
                <table class="inner_tab">
                    <tbody>
                        <tr>
                            <th valign="top" colspan="2">I.</th>
                        </tr>
                        <tr>
                            <td valign="top" class="inner_td">
                                <span class="separator">Morfologia ogólna</span>
                            </td>
                        </tr>
                        <tr>
                            <td valign="top" class="inner_td">
                                <span class="lp">1. 
                                    <span style="font-weight: bold;"> HCT </span> - <span class="inner_td_text">Hematokryt</span>
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
            <td valign="top" class="outer_td">
                <table class="inner_tab">
                    <tbody>
                        <tr>
                            <th valign="top" colspan="2">II.</th>
                        </tr>
                        <tr>
                            <td valign="top" class="inner_td">
                                <span class="separator">Morfologia ogólna</span>
                            </td>
                        </tr>
                        <tr>
                            <td valign="top" class="inner_td">
                                <span class="lp">1. 
                                    <span style="font-weight: bold;"> HCT </span> - <span class="inner_td_text">Hematokryt</span>
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
            <td valign="top" class="outer_td">
                <table class="inner_tab">
                    <tbody>
                        <tr>
                            <th valign="top" colspan="2">III.</th>
                        </tr>
                        <tr>
                            <td valign="top" class="inner_td">
                                <span class="separator">Morfologia ogólna</span>
                            </td>
                        </tr>
                        <tr>
                            <td valign="top" class="inner_td">
                                <span class="lp">1. 
                                    <span style="font-weight: bold;"> HCT </span> - <span class="inner_td_text">Hematokryt</span>
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>  
        </tr>
    </tbody>
</table>

CSS看起来像这样:

<style type="text/css">
    @page { margin: 1cm; }

    body {
        background-image: url('<?php echo 'module/Application/assets/pdf/images/faktury-tlo-small.png'; ?>');
        background-repeat: no-repeat;
        background-size: 20%;
        background-position: center center;
    }
    table.outer_tab, table.inner_tab  { border-spacing: 0; width: 100% }
    table.inner_tab th { text-align: center; background: #BDC0BF; font-size: 15px; font-weight: bold; padding: 2px 0; }
    td.outer_td { border-top: 1px solid #BDC0BF; border-left: 1px solid #BDC0BF; /*width: 33%;*/ border-bottom: 1px solid #BDC0BF; }
    td.outer_td:last-of-type { border-right: 1px solid #BDC0BF; }
    tr.outer_tr:last-of-type td.outer_td { border-bottom: 1px solid #BDC0BF; }
    span.lp { padding-left: 10px; display: block; }
    span.inner_td_text { /*padding-right: 10px;*/ }
    span.separator { font-weight: bold; text-align: center; font-size: 15px; padding-bottom: 10px; display: block; }
    .footer { position: fixed; bottom: 0px; width: 100%; font-size: 11px; }
</style>

线路问题是:

td.outer_td { border-top: 1px solid #BDC0BF; border-left: 1px solid #BDC0BF; /*width: 33%;*/ border-bottom: 1px solid #BDC0BF; }

如果在 td.outer_td中有宽度:33%,则PDF在表格前面有空白页

任何人都知道为什么会这样吗? 解决这个问题的方法是什么?

0 个答案:

没有答案