在打印页面底部添加填充，为固定位置页脚创建空间？

Question

我正在为打印页面设计样式。我想要做的是在每个打印页面上都有一个具有指定高度的页脚。我通过使用ngOnInit() {} 来实现这一点，不幸的是，这会导致页脚覆盖部分页面内容。我已经尝试为position:fixed;添加底部边距/填充，但是当我使用边距时，它会向上推动页脚，当我使用填充时，它似乎没有任何效果。

@page

.container {
  font-size:45px;
}

.print-footer {
  display:none;
  height:60px;
  background:#fff;
  width:100%;
  position:fixed;
  bottom:0;
}

@page {
  size:8.5in 11in;  
  margin:0;
  /*margin:0 0 60px 0;*/ /* this pushes the print-footer element up */
  padding-bottom:60px; /* this doesn't seem to have an effet */
  orphans:5; 
  widows:5;
}

@media print {
  .print-footer {
    display:block;
  }
}

正如您在上面的代码的结果表中所看到的，页脚正在切断内容：