3

我需要你的帮助，

当在 Internet Explorer 11 中完成打印预览时，我似乎无法弄清楚为什么 div（下边框）会中断到下一页：

无论哪种方式，如果可以正确完成，或者通过其他方法，理想情况下，id 都希望在页面周围获得 1 像素的边框（字母大小，8.5 英寸 x 11.0 英寸）并带有一些边距。

在此处输入图像描述 在此处输入图像描述

这是有问题的 HTML 和 CSS 标记：

<!DOCTYPE html>

<html>

<head>

<style type="text/css">
@page {
    margin: 0.25in;
}
html,body {
    height: 100%;
    margin: 0;
    padding: 0;
}
.table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}
.table td {
    padding: 0;
}
</style>

</head>

<body>


<div style="border:1px solid grey; height: 100%;">
<table class="table" cellspacing="0" cellpadding="0">
    <tr>
        <td>File Number:</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>
</div>


</body>

</html>
4

1 回答 1

2

问题与 CSS 盒子模型有关。默认情况下，边框被添加到宽度/高度的外侧，因此您需要将 box-sizing 更改为边框框，这会将边框放在宽度/高度的内侧：

<div style="border:1px solid grey; height: 100%; box-sizing: border-box">...

如果不将其更改为边框框，则 div 的高度将为 100% + 2px（上边框为 1px，下边框为 1px），这会导致溢出到第二页。

于 2016-05-10T18:46:01.760 回答