Hi
I have currently two problems where I cant get paging right.
First:
Code: HTML/ASPX
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Test</title>
</head>
<body>
<div class="bigWrapper">
<div class="divBeforeTitleWrapper"></div>
<div class="titleWrapper">
<h1>Template test 1</h1>
</div>
<div class="bodyWrapper">
<p>P1</p>
<p>P2</p>
<p>P3</p>
</div>
</div>
<div class="bigWrapper">
<div class="divBeforeTitleWrapper"></div>
<div class="titleWrapper">
<h1>Template test 2</h1>
</div>
<div class="bodyWrapper">
<p>P4</p>
<p>P5</p>
<p>P6</p>
</div>
</div>
</body>
</html>
Code: CSS
p, .titleWrapper{
page-break-inside: avoid;
}
//Opt 1
.titleWrapper{
page-break-after: avoid;
}
//Opt 2
.bodyWrapper > p:first-child {
page-break-before: avoid;
}
In my full scenario the "bigWrapper" is the repeating structure with slightly difrent content. I tested this very many difrent styles but in css there is one example that I think should be working.
1. rule: make sure that page break wont happen inside title or p elements.
2. rule: page break wont occure between titleWrapper and bodyWrapper. //This leads to situation that titleWrapper and bodyWrapper stay together (like wanted) AND bodyWrapper staying one piece (".bodyWrapper { page-break-inside: avoid; }") which is unwanted
3. rule: page break wont occure between bodyWrapper and first p //Not cause any visible effect
So the goal is to keep title wrapper with first element ("P1" in this case). And in my test I have placed so much content before first bigWrapper that natural break point should be between P1 and P2. Still I get always
A: it wont keep title and P1 together
B: it will keep whole bodyWrapper together
Second problem:
If I have table which has more content than there is space in page I am not able to get it right. This is actually scenario that at least one rule need to be broke.
Rules (priozed order):
1. Dont cut single row or heading
2. Dont separate heading from rows
3. Dont cut between element before table (in real scenario: dont break between title and table, if title exists)
4. Dont cut table
In practice last rule should be broke pretty often but not another ones.
I get this work with this css:
Code: CSS
//This works pretty well, even it shouldn't
td, th {
page-break-inside: avoid;
}
table {
page-break-before: avoid;
}
But in some cases its actually causing (in my opinion) extra page break (see image table1). Also that "dont break before table" also cause "dont break inside table" but in this scenario this is wanted behaviour and actually adding "dont break inside table" cause problems in some cases. So check see next css (and image table2).
Code: CSS
//I think this should work like last one
td, th, table {
page-break-inside: avoid;
}
table {
page-break-before: avoid;
}
Table image 1:
Table image 2:
Edit: So long story short, two problems:
A: "page-break-after/before" avoid cause also unwanted" page-break-inside avoid" behaviour.
B: In same cases I think I would need _priorized_ paging rules, any tips? Could be possible get some C# functionality to handle page breaking manually? Like with this kind of event: "bool OnPageBreak(HtmlElement ele)".