danfickle / danfickle/openhtmltopdf
Absolute positioning fails in some common cases
- Dominant language
- Java
- Stars
- 2.2k
- Forks
- 423
- PR merge metrics
- No merged PRs in 30d
Description
I noticed that absolute positioning has a few annoying defects in the way it deals with vertical lengths:
1) **anchoring to page bottom**: anchoring an element to page bottom makes it leak to next page (obviously, it should stay entirely on the target page, see test cases 2 and 3 here below)
2) **wrong resolution of relative references to element height**: element height in percentage is wrongly resolved (see test case 6 here below)
Test cases
No automated test suite here, just my observations from casual trials (made a bit more systematic to evaluate fringe cases). This is the code chunk used to generate the renderings:
```java
try (OutputStream os = new FileOutputStream(new File("absolute.pdf"))) {
try (PdfBoxRenderer renderer = new PdfRendererBuilder().withFile(new File("absolute.html"))
.toStream(os).buildPdfRenderer()) {
renderer.createPDF();
}
}
```
And this is the source HTML body:
```html
1-Some contents to fill
-What?
2-Some contents to
fill
-What?
3-Some contents to fill
-What?
4-Some contents to fill
-What?
5-Some contents to
fill
-What?
6-Some contents to fill
-What?
7-Some contents to fill
-What?
8-Some contents to
fill
-What?
9-Some contents to fill
-What?
10-Some contents to fill
-What?
11-Some contents to
fill
-What?
```
NOTE: All the outputs are compared side-by-side with renderings by Chrome/Blink engine (print mode).
1. top-left at page top-left: OK
```html
.element {
position: absolute;
left: 0;
top: 0;
}
```
[absolute_topleft.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135650/absolute_topleft.html.txt)
[absolute_topleft.pdf](https://github.com/danfickle/openhtmltopdf/files/6135651/absolute_topleft.pdf)
2. bottom-left at page bottom-left: FAILED
The element wrongly leaks down to next page. It seems like a limit condition during the placement of last text line tested true despite the height of its containing div was purposely calculated to make enough room for it.
```html
.element {
position: absolute;
left: 0;
bottom: 0;
}
```
[absolute_bottomleft.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135656/absolute_bottomleft.html.txt)
[absolute_bottomleft.pdf](https://github.com/danfickle/openhtmltopdf/files/6135657/absolute_bottomleft.pdf)
3. bottom-right at page bottom-right: FAILED
The element wrongly leaks down to next page, same as test case 2.
```html
.element {
position: absolute;
right: 0;
bottom: 0;
}
```
[absolute_bottomright.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135658/absolute_bottomright.html.txt)
[absolute_bottomright.pdf](https://github.com/danfickle/openhtmltopdf/files/6135659/absolute_bottomright.pdf)
4. top-left at page center: OK
The element leaks down to next page as expected.
```html
.element {
position: absolute;
left: 50%;
top: 50%;
}
```
[absolute_topleft-center.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135660/absolute_topleft-center.html.txt)
[absolute_topleft-center.pdf](https://github.com/danfickle/openhtmltopdf/files/6135661/absolute_topleft-center.pdf)
5. bottom-right at page center: OK
The element leaks above the page to nowhere as expected.
```html
.element {
position: absolute;
right: 50%;
bottom: 50%;
}
```
[absolute_bottomright-center.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135667/absolute_bottomright-center.html.txt)
[absolute_bottomright-center.pdf](https://github.com/danfickle/openhtmltopdf/files/6135669/absolute_bottomright-center.pdf)
6. center at page center (transform): FAILED
Wrong element height calculated for vertical translation (element should move upwards by 50% of its height).
```html
.element {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%)
}
```
[absolute_center.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135674/absolute_center.html.txt)
[absolute_center.pdf](https://github.com/danfickle/openhtmltopdf/files/6135675/absolute_center.pdf)
7. rotate around center (transform): OK
```html
.element {
position: absolute;
left: 50mm;
top: 50mm;
transform: rotate(-45deg);
}
```
[absolute_rotate-center.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135677/absolute_rotate-center.html.txt)
[absolute_rotate-center.pdf](https://github.com/danfickle/openhtmltopdf/files/6135679/absolute_rotate-center.pdf)
8. rotate around top-left (transform): OK
```html
.element {
position: absolute;
left: 50mm;
top: 50mm;
transform-origin: 0 0;
transform: rotate(-45deg);
}
```
[absolute_rotate-topleft.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135680/absolute_rotate-topleft.html.txt)
[absolute_rotate-topleft.pdf](https://github.com/danfickle/openhtmltopdf/files/6135681/absolute_rotate-topleft.pdf)
9. rotate around bottom-right (transform): OK
```html
.element {
position: absolute;
left: 50mm;
top: 50mm;
transform-origin: 100% 100%;
transform: rotate(-45deg);
}
```
[absolute_rotate-bottomright.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135682/absolute_rotate-bottomright.html.txt)
[absolute_rotate-bottomright.pdf](https://github.com/danfickle/openhtmltopdf/files/6135683/absolute_rotate-bottomright.pdf)
10. size relative to page (partial and full): OK
```html
.element {
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 50%;
}
```
[absolute_size-relative.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135685/absolute_size-relative.html.txt)
[absolute_size-relative.pdf](https://github.com/danfickle/openhtmltopdf/files/6135688/absolute_size-relative.pdf)
```html
.element {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
```
[absolute_size-relative-full.html.txt](https://github.com/danfickle/openhtmltopdf/files/6135689/absolute_size-relative-full.html.txt)
[absolute_size-relative-full.pdf](https://github.com/danfickle/openhtmltopdf/files/6135690/absolute_size-relative-full.pdf)
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.