CSS页脚之前的裁切页面

Question

此问题已经在Stackoverflow中解决。但是，如果有人能为我提供解决方案，我很感激。

我想用CSS和HTML创建PDF。我已经添加了一个页脚。

@page { 
     @bottom-left {content: element(footer);} 
     size:A4 portrait; 
     margin-left: 0; 
     margin-right: 0; 
     margin-top: 0; 
} 

div.footer { 
      display: block; 
      position: running(footer); 
      position: fixed; 
      bottom: 0; 
      left: 0; 
      z-index: 5; 
      } 

<div class="footer" style="padding-left: 1.7cm;"> 
     MY FOOTER 
</div> 

这会呈现正确的页脚，但页面内容也会与其重叠。我如何避免重叠并在下一页显示溢出内容？

Answer 1

删除从页脚固定位置，并添加边距底部页

@page { 
     @bottom-left {content: element(footer);} 
     size:A4 portrait; 
     margin: 0 0 5cm 0; 
    } 

div.footer { 
      display: block; 
      position: running(footer); 
      z-index: 5; 
      }