Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in

[PDF Export] Padding broken? - Styling Problem

Marcel Sinn November 27, 2015

padding-left-right-error.png

 

Dear Atlassian-Community,

I've read about the official "PDF Export Documentation" (https://confluence.atlassian.com/doc/customise-exports-to-pdf-190480945.html) and even the advanced guide but I am still missing some points to build a more advanced document.

Are there more describing "snippets" about the PDF export or even some practical examples ?

The biggest problem for me is when I add padding(left/right) to @page it is scaling the content correct but @top-left, @top-center, @top-right (same with bottom) feels like they are just using padding-right.

In the picture you can see @page (red), @top-center(green), and the content is white with the subtitle.

It is only styled by .CSS with the code below:

@page

{

size: 210mm 297mm;

margin: .7in .5in;

padding-left: 5em;

padding-right: 5em;

background-color: red;

@top-center {

width: 210mm !important; height: 20px; !important;

font-size: 10pt;

text-align: center;

border-bottom: 2px solid white;

background-color: green; }

}


What I am trying to achieve is a very clean page with increased padding(left/right) and a header/footer with a width of 100%.

 

Maybe one of you can help me? Would be great!

 

Thanks a lot already!

~ Marcel

3 answers

1 accepted

1 vote
Answer accepted
Steffen Heller
Rising Star
Rising Star
Rising Stars are recognized for providing high-quality answers to other users. Rising Stars receive a certificate of achievement and are on the path to becoming Community Leaders.
November 30, 2015

Hi,

I don't think what you try is possible.

If you check http://www.w3.org/TR/2006/WD-css3-page-20061010/#margin-box-def you see that the page margins translate into top-left-corner and top-right-corner in the header.

If you want a header with 100% the page margin and padding must be 0.

Perhaps you can live with some kind of a fake:

  • Define the same background-color for top-left-corner, top-center and top-right-corner and it will look as if it was a 100% header (text can only be placed in top-center though) -or-
  • Use an 100% width image as header and define it as background-image of the @page {...} -or-

  • Define page margin and padding as 0 but add margin at .wiki-content {...}

0 votes
GG December 13, 2017

Hi Marcel,

Check out Content Exporter for Confluence addon for PDF export. You might need less or no coding at all for exporting using this addon:

https://marketplace.atlassian.com/plugins/com.metainf.confluence.plugin.pagetreeexporter.pagetree-word-exporter-plugin/cloud/overview 

0 votes
Marcel Sinn November 30, 2015

The last sentence was the one I was looking for!

Define page margin and padding as 0 but add margin at .wiki-content {...}

 

Thanks a lot already! You'll hear from me If it worked out the way I think it does =) 

 

Greetings 

~ Marcel

 

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events