css - @print 从下一页开始

Question

我正在设置@print 媒体查询，但无论我做什么，我的页面在 pdf 预览中看起来都很棒，但是当我打印出来时，它从页面的一半开始？因此，页面的前半部分在打印文档中完全缺失。它不会在新的 div 开始时被切断，而是在 div 中途被切断。

打印页面底部也有很多空白区域。我已经设置了宽度，但不知道如何解决这个问题？这是外部 CSS 表中的 @print 代码:

    @media print{
#nav-bar-upper, .nobr, #contact-and-follow, #blower-mob, #SkypeButton_Call_darrenmortonphotography, #back-to-top-div, #facebook-div{display: none;}
#upper-section{height: 100px;}
#print-website, #print-phone{display: block; text-align: center;}
.title-left{text-decoration: underline;}
h1, h2, h3, p, li, .title-left{color: black; font 12pt "helvetica"}

body, #main-container, #upper-section, #lower-section {width: 80%; margin: 0; padding: 0;}
@page{margin-left: 1cm; margin-right: 1cm; margin-bottom: 0; padding: 0;}  
}

任何想法会导致这种情况以及如何解决它？我到处搜索，但找不到解决方案。

Answer 1

好的，所以我发现了问题所在并将其张贴在这里，以防其他人遇到同样的问题。完全愚蠢，因此我想到的最后一件事!打印机设置错误!当我尝试从另一个网页打印时，我发现它的打印方式与我的网站相同。我仔细查看了我的打印机设置，在更改页面周围的内容后，现在可以正常打印了!希望这可以帮助某人避免像我试图解决这个问题那样浪费大约 4 个小时!