CSS Paged СМИ, отд разрывы страниц на следующей странице

мне нужна ваша помощь,CSS Paged СМИ, отд разрывы страниц на следующей странице

Я не могу показаться, чтобы выяснить, почему ДИВ (нижняя граница) разбивается на следующую страницу, когда предварительный просмотр печати выполняется в Internet explorer 11:

В любом случае, если это можно сделать правильно или с помощью другого метода, id идеально подходит для получения границы 1px вокруг страницы (размером в letter, 8.5inches x 11.0inches) с некоторыми полями.

Вот 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>

источник

2016-05-10 BobbyJones

Из любопытства вы попробовали добавить 'box-sizing: border-box;' в div, чтобы гарантировать, что граница не добавлена * к 100% -ной высоте? – Quantastical

Это таинственно работает! Пожалуйста, опубликуйте это как возможное решение, и я соглашусь – BobbyJones

Проблема связана с моделью CSS коробки. По умолчанию границы добавляются к вне по ширине/высоте, так что вам нужно изменить коробчатого проклейки пограничному ящик, который ставит границы на внутри по ширине/высоте:

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

Если вы не измените его на border-box, div будет иметь высоту 100% + 2px (1px для верхней границы, 1px для нижней границы), что приводит к переполнению на вторую страницу.

источник

2016-05-10 18:46:01 Quantastical

CSS Paged СМИ, отд разрывы страниц на следующей странице

ответ

Смежные вопросы