将水平滚动的内容打印到下一页 - 可能吗？答案

【问题标题】：Printing horizontally scrolling content onto the next page - possible?将水平滚动的内容打印到下一页 - 可能吗？
【发布时间】：2013-04-03 21:23:06
【问题描述】：

我尝试打印水平滚动内容没有成功。我已经到了厌倦搜索的地步，我想是时候问了-

所以，下面是我要打印的内容的真正简化版本 -

HTML

<div id="printingDiv">

    <div class='filterRow'>Something long to print#1 Something long to print#2 Something long to print#3 Something long to print#4 Something long to print#5 Something long to print#6 Something long to print#7 Something long to print#8 Something long to print#9 Something long to print#10</div><br/>

    <div class='filterRow'>Something long to print#1 Something long to print#2 Something long to print#3 Something long to print#4 Something long to print#5 Something long to print#6 Something long to print#7 Something long to print#8 Something long to print#9 Something long to print#10</div><br/>

    <div class='filterRow'>Something long to print#1 Something long to print#2 Something long to print#3 Something long to print#4 Something long to print#5 Something long to print#6 Something long to print#7 Something long to print#8 Something long to print#9 Something long to print#10</div><br/>

    <div class='filterRow'>Something long to print#1 Something long to print#2 Something long to print#3 Something long to print#4 Something long to print#5 Something long to print#6 Something long to print#7 Something long to print#8 Something long to print#9 Something long to print#10</div><br/>

</div>

CSS

.printDiv {
     font-size: 12pt; //else the content adjusts its font-size just to fit the print page
     width: auto;
}

.filterRow {
     white-space: no-wrap; //just for the sake of this example, to make sure the content overflows
     width: auto;
}

Javascript

$("#printingDiv").show();
window.print();

输出

在打印输出上 - 我只看到关于Something long to print#5 和Something long to print#6 的部分内容。

我想看到的是Something long to print#6 到Something long to print#10 打印在下一页的其余部分。

所以，总而言之，我希望能够将不适合第一页的水平滚动内容打印到另一页上。这甚至可能吗？

我提到的一些链接 -

http://alistapart.com/article/goingtoprint

http://meyerweb.com/eric/articles/webrev/200001.html

Print Stylesheets for pages with long horizontal tables - （此链接还有一些其他选项，这是唯一的方法吗？）

【问题讨论】：

标签： javascript css printing-web-page

【解决方案1】：

又短又甜：不...

您完全无法控制使用 javascript 打印的方式。您能做的最好的事情就是将“Something long to print#6+ 换到下一行”。

【讨论】：

经过几天尝试以多种方式做到这一点，我将不得不同意你的看法。

【解决方案2】：

从理论上讲，如果您知道要截断哪个副本并将该文本包含在一个隐藏在屏幕上但在打印时可见的块中，您就可以做到。

<div class="noWrapContent">This is a long piece of text that stops here. This is the text that would be cut off.</div>
<div class="forPrint">This is the text that would be cut off.</div>

然后在 css 中：

.forPrint { display: none; }

@media print { display: block;}

但是，总的来说，您应该在打印时将其包裹起来。

【讨论】：