Using ‘display: absolute’ with ‘page-break-inside: avoid’

#27150

Hallo,

I’m having problems using a div with ‘position: absolute’ inside an other div with ‘position: relative’ in combination with ‘page-break-inside: avoid’. The relative divs are positioned as is expected. But the absolute positioned divs are rendered like they would be with out the page break.

Example code:
<br /> <%<br /> for ( int i = 0; i < 10; i++ ) {<br /> %><br /> <table><br /> <tr style="page-break-inside: avoid"><br /> <td><br /> <div style="position: relative; width: 400px; height: 400px; border: solid 2px red;"><br /> Outer div: <%=i%><br /> <div style="position: absolute; left: 100px; top: 100px; width: 200px; height: 200px; border: solid 2px green;"><br /> Inner div: <%=i%><br /> </div><br /> </div><br /> </td><br /> </tr><br /> </table><br /> <%<br /> }<br /> %><br />

See screenshot of generated output. The green divs should always be in the exact center of the red divs, but this is not the case.

Does anybody have an idea how to fix this problem?

#30061

A page breaking logic for absolute positioned elements was too browser-specific the time we added it to PD4ML. So we implemented two (reasonable from our perspective) modes. There were also strange approaches: i.e. the absolute positioned elements are rendered only on the first page. We did not support that.

So try the alternative mode:

[language=java:1w2yzs33]Map m = new HashMap();
m.put(PD4Constants.PD4ML_ABSOLUTE_ADDRESS_SPACE, “document”);
pd4ml.setDynamicParams(m);[/language:1w2yzs33]

Or switch the mode on by the JVM param:
-Dpd4ml.absolute.address.space=document

[Author]

Posts