Description
I'm using the following configuration to prevent panels from being split across PDF pages:
pagebreak: {
mode: ['avoid'],
avoid: ['.panel', '.widget', 'tr']
}
However, there are cases where the elements are still split across a page boundary, despite being included in the avoid list.
Expected behaviour
If a .panel, .widget or tr cannot fit in the remaining space on the current page, I would expect the entire element to be moved to the next page.
Actual behaviour
Depending on the position and height of the preceding content, a element can be positioned close to the page boundary and end up being partially split across two pages.
I've found that applying a small arbitrary pixel adjustment can sometimes resolve the issue for a particular layout. However, the required adjustment varies depending on the surrounding content, so a fixed offset isn't a reliable solution.
This is particularly problematic for our application because the page consists of dynamically sized panels and widgets and tables, meaning there isn't a consistent pixel offset that can be applied.
Reproduction
Minimal JSFiddle demonstrating the issue:
https://jsfiddle.net/DanTheMan13/mu7zegtr/6/
The height of the content preceding the panels can be changed to move the panel relative to the page boundary.
Related issue
This appears related to the page-break calculation behaviour discussed in #227, although we are using mode: ['avoid'] rather than avoid-all.
Question
Is this a known limitation/issue with how pagebreak.avoid calculates the element's position relative to the page boundary?
Is there a recommended way to ensure an avoided element is moved to the next page when it cannot fit completely, without relying on an arbitrary pixel offset?
Description
I'm using the following configuration to prevent panels from being split across PDF pages:
pagebreak: {
mode: ['avoid'],
avoid: ['.panel', '.widget', 'tr']
}
However, there are cases where the elements are still split across a page boundary, despite being included in the avoid list.
Expected behaviour
If a .panel, .widget or tr cannot fit in the remaining space on the current page, I would expect the entire element to be moved to the next page.
Actual behaviour
Depending on the position and height of the preceding content, a element can be positioned close to the page boundary and end up being partially split across two pages.
I've found that applying a small arbitrary pixel adjustment can sometimes resolve the issue for a particular layout. However, the required adjustment varies depending on the surrounding content, so a fixed offset isn't a reliable solution.
This is particularly problematic for our application because the page consists of dynamically sized panels and widgets and tables, meaning there isn't a consistent pixel offset that can be applied.
Reproduction
Minimal JSFiddle demonstrating the issue:
https://jsfiddle.net/DanTheMan13/mu7zegtr/6/
The height of the content preceding the panels can be changed to move the panel relative to the page boundary.
Related issue
This appears related to the page-break calculation behaviour discussed in #227, although we are using mode: ['avoid'] rather than avoid-all.
Question
Is this a known limitation/issue with how pagebreak.avoid calculates the element's position relative to the page boundary?
Is there a recommended way to ensure an avoided element is moved to the next page when it cannot fit completely, without relying on an arbitrary pixel offset?