1

我正在尝试创建一个cfhtmltopdf包含 2 行 div 的 pdf，这些 div 的 css 设置为position:relative;. 在每一行之间，我想有一个分页符，我用<cfhtmltopdfitem type="pagebreak" />.

这将创建分页符并将第二行添加到第二页，但是第二行仍包含在第一页中（因此它现在被复制了）。如果您删除position:relative它，它会解决问题，但会破坏我的格式。

我尝试将代码包装在另一个 div 或不包含的表中，position:relative;但我发现如果此内容 (divs,tables) 有一个具有相对位置的对象，则会发生同样的问题。有没有人可以解决这个问题？示例代码如下。

<cfhtmltopdf orientation="landscape">
<!DOCTYPE html>
    <head>
        <title>Test Page</title>        
        <style>
            .block{width: 288px; height: 255px; margin: 0 0 10px 8px;position:relative;padding: 0; display:inline-block; top: 0; left:0; vertical-align:top;background: #cee7f4;color: #0081C6;}
            .block2{width: 288px; height: 255px; margin: 0 0 10px 8px;padding: 0; top: 0; left:0; vertical-align:top;background: #cee7f4;color: #0081C6;display:inline-block;}
        </style>
    </head>
    <body>
        <div style="position:static;display:block;border:1px solid green;">test1
            <div class="block">
                Block 1
            </div>

            <div class="block">
                Block 2
            </div>

        </div>

        <cfhtmltopdfitem type="pagebreak" />

        <div style="position:static;display:block;border:1px solid red;">test 2
            <div class="block">
                Block 3
            </div>

            <div class="block">
                Block 4
            </div>

        </div>

        <cfhtmltopdfitem type="pagebreak" />        

        <div>This code works</div>

        <div class="block2">
            Block 5
        </div>

        <div class="block2">
            Block 6
        </div>

        <cfhtmltopdfitem type="pagebreak" />    
        <div class="block2">
            Block 7
        </div>

        <div class="block2">
            Block 8
        </div>

    </body>
</html>
</cfhtmltopdf>
4

0 回答 0