PDF Exporter footer (single page)

Question

Dear all,

I've been busy trying to style the PDF exporter for a single page according to our corporate Identy. Know I'm stuck on two parts that I hope somebody has an answer to. The issues are:

*  I want my footer image on the edge of the PDF page. But due to the margin set on the page. I can't seem to align the image on the edge. 
* On our pages sometimes the expand macro form Atlassian is used. Then the items on the pages are all expanded which is fine. But these "tables" are far to wide for the PDF page. I'd like to make sure that these are fit to the pages automatically.

Image 1. Shows the yellow blocks which should be aligned to the right of the page

Image 2. Shows how the Expand Macro is running of the page.

Below the uses CSS for the footer image.

@bottom-right {
text-align:center;
font-family: ConfluenceInstalledFont, Verdana, sans-serif;
font-size: 11pt;
color:#263682;
vertical-align:right;
padding:0px 0px;
content: counter(page) " / " counter(pages); "; /*Shows page number*/;
white-space:nowrap;
background-image: url(https://........../footer_image_yellow_center.png?api=v2);
background-size: 100% auto;
position:absolute; right:0;
background-repeat: no-repeat;
page-break-inside: avoid;
}

Hopefully somebody has an answer to my problems.

Kind regards. Harold

Steffen Heller · Answer

I don't know the expand macro. I would need info what that is, how it works, what the css is like aso.

Harold_i2hsrv · Answer

Stefan,

Thanks for your advice. I'll be sure to test this. Seems logical. 
Regarding point 2 the "expand macro" you don't have any advise?

I'll test the css and report back via this post.

Kind regards.

Harold

Steffen Heller · Answer

Hi @Harold,
as regards the positioning of the image, define it as background-image of @page and not of @bottom-right. This way, the margin doesn't matter.

Something like this:

@page {
size: 210mm 297mm;
background-image: url(/download/attachments/.../image.png);
background-repeat: no-repeat;
background-position: bottom right;
}