在一页上打印多页发票
我有一张发票,其中包含我要打印的 100 多种产品。这张发票应该超过 3 页,但打印时,内容会从页脚流出,下一页是下面的发票。
我使用 div 而不是表格,我不明白为什么长发票不会打印在多页上。
有什么想法吗?
这是我的样式表:
h1,h2,h3 { margin: 0 0 0.5em 0; padding: 0;}
body { font-family: sans-serif; font-size: 0.8em; }
label, legend { font-weight: bold; }
pre { font-family: sans-serif; }
shipping_address {
width: 45%;
}
billing_address {
width: 45%;
}
order_info {
padding: 0 10px;
}
shipping_logo {
width: 115px;
}
content {
margin: 0px auto 0px auto;
width: 100%;
padding-bottom:15px;
}
div.container {
display: table;
width: 100%;
}
div.header {
display: table-row;
text-align: center;
}
div.row {
display: table-row;
}
.even {
background: #CCCCCC none repeat scroll 0 0;
}
div.cell {
display: table-cell;
padding: 0 10px;
}
I have an invoice that contains over 100 lines of product that I am trying to print. This single invoice should take over 3 pages, but when printed, the content flows off the footer and the next page is the following invoice.
I am using divs instead of tables, and I can't understand why the long invoices will not print on multiple pages.
Any ideas?
Here's my stylesheet:
h1,h2,h3 { margin: 0 0 0.5em 0; padding: 0;}
body { font-family: sans-serif; font-size: 0.8em; }
label, legend { font-weight: bold; }
pre { font-family: sans-serif; }
shipping_address {
width: 45%;
}
billing_address {
width: 45%;
}
order_info {
padding: 0 10px;
}
shipping_logo {
width: 115px;
}
content {
margin: 0px auto 0px auto;
width: 100%;
padding-bottom:15px;
}
div.container {
display: table;
width: 100%;
}
div.header {
display: table-row;
text-align: center;
}
div.row {
display: table-row;
}
.even {
background: #CCCCCC none repeat scroll 0 0;
}
div.cell {
display: table-cell;
padding: 0 10px;
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您可能想要指定特定的打印样式表。例如,
您可以在要分页的位置应用分页符类。 本文提供了一些格式化页面以进行打印的巧妙技巧。
You might want to specify specific stylesheets for printing. For example,
You can then apply the page-break class where you want to page to break. This article has a few neat tricks to format a page for printing.
为了真正解决这个问题,我们需要比您建议的更多的信息。
然而,如果您将某些东西设置为高度为 100%,无论是桌子、div 还是其他东西,那么盲目地尝试会导致类似的行为。有时这样做是为了尝试将页脚保留在浏览器窗口的底部,如果这样做,可能会在打印时导致此行为。
We're going to need much more information than what you have suggested to really tackle this problem.
However, a pretty blind stab at something that would cause a similar behavior is if you had something set such that the height is 100%, whether it's a table, a div, or something. This is sometimes done to try and keep a footer at the bottom of the browser window and if you do that, this can cause this behavior when printing.