-
Notifications
You must be signed in to change notification settings - Fork 364
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
#180 - Test (FAILING, SERIOUS) - The footer element is not rendering.…
… [ci skip] Tests that a nested float in a fixed element renders correctly. Appears to be an ordering issue of the layers as if header and footer swap element order everything works.
- Loading branch information
Showing
2 changed files
with
64 additions
and
0 deletions.
There are no files selected for viewing
53 changes: 53 additions & 0 deletions
53
openhtmltopdf-examples/src/main/resources/visualtest/html/text/fixed-nested-float.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
<html> | ||
<head> | ||
<style> | ||
@page { | ||
size: 200px 200px; | ||
margin: 30px; | ||
|
||
-fs-max-overflow-pages: 10; | ||
-fs-overflow-pages-direction: ltr; | ||
} | ||
body { | ||
margin: 0; | ||
width: 140px; | ||
height: 140px; | ||
} | ||
.header { | ||
height: 30px; | ||
position: fixed; | ||
bottom: 0; | ||
right: 0; | ||
} | ||
.footer { | ||
height: 30px; | ||
position: fixed; | ||
top: 0; | ||
left: 0; | ||
} | ||
.header .inner { | ||
float: right; | ||
} | ||
.footer .inner { | ||
float: left; | ||
} | ||
.inner { | ||
background-color: orange; | ||
border: 2px solid black; | ||
width: 50px; | ||
height: 15px; | ||
} | ||
.float2 { | ||
background-color: green; | ||
} | ||
</style> | ||
</head> | ||
<body style="font-family: 'TestFont'; color: black; font-size: 13px;"> | ||
<div class="header" style="background-color: blue;"><div class="inner"></div><div class="inner float2">abcd</div></div> | ||
<div class="footer" style="background-color: red;"><div class="inner"></div><div class="inner float2">dcba</div></div> | ||
|
||
<div>PAGE 1</div> | ||
<div style="width: 150%; height: 20px; background-color: pink; page-break-after: always;"></div> | ||
<div>PAGE 2</div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters