在Chrome上打印Bootstrap表时出错

Question

当我想在Chrome下打印我的网页时,我有一个奇怪的错误.我使用Bootstrap显示一个表,它完全符合屏幕尺寸(无论屏幕大小是多少).当我想在Chrome下打印网页时,表格会被裁剪,而打印布局非常适合使用Firefox.

我已经设法在这里重现我在JSFiddle上的错误.

我表的html代码是:

<table class="table table-condensed">
    <thead>
        <tr>
            <th>Col1</th>
            <th>Col2</th>
            <th>...</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="...">
            <td>...</td>
            <!-- ... -->
        </tr>
        <tr class="separator empty" />
    </tbody>
</table>

你有任何想法解决这个问题吗？
也许为表使用不同的Bootstrap css类？

Answer 1

指定初始缩放尺寸打印所有内容。

@media print {
    body {
        zoom: .8
    }
}

小提琴： http: //jsfiddle.net/HB7LU/11671/