Images are note centered on PDF Export

[Jens Kasperek (Bosch GmbH)]

This question is in reference to Atlassian Documentation: Customise Exports to PDF

We just migrated to Confluence 5.8.16. Unfortunately, we experience issues with the PDF export. We have some pages where images are centered and are displayed as centered, correctly. If we export them to PDF, images will be re-aligned to the left. Does someone know, if we can rewrite this behaviour ?

See also: https://jira.atlassian.com/browse/CONF-38632

2016-02-06_10h31_31.png

[Jens Kasperek (Bosch GmbH)]

We just found a pretty and smart solution for pictures that are either not centered or aligned to the right!

Append the following code to your PDF stylesheet:

span.confluence-embedded-file-wrapper {   
    display: inline-block !important;  
}

If not just images are affected, but other spans, you can embed the following:

p[style="text-align: center;"] span,  
p[style="text-align: right;"] span  
 {   
    display: inline-block !important;  
}

Issue Description

The actual issue is about the <span> tag that wraps the image. After centering an image with the editor, you have a construct like

<p style="text-align: center;"><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size"><img class="confluence-embedded-image" src="/xsystem/download/attachments/344041801/Koala.jpg?version=1&modificationDate=1448543356520&api=v2" data-image-src="/xsystem/download/attachments/344041801/Koala.jpg?version=1&modificationDate=1448543356520&api=v2" data-unresolved-comment-count="0" data-linked-resource-id="382009443" data-linked-resource-version="1" data-linked-resource-type="attachment" data-linked-resource-default-alias="Koala.jpg" data-base-url="https;//*/xsystem" data-linked-resource-content-type="image/jpeg" data-linked-resource-container-id="344041801" data-linked-resource-container-version="15" height="250"></span></p>

The style 'text-align:center' will not be applied to the <img> tag due to the span tag which has this missing property: "display:inline-block;"


@Atlassian: Please provide this fix in an upcoming version!

[Attila Gaspar _META-INF_]

Hi @Jens Kasperek (Bosch GmbH),

I used Content Exporter addon (available in Cloud too) to export a test page and the alignment seems to be correct in PDF (see the attached picture)

BR: Attila

2016-02-06_10h31_31.png

[Steffen Heller]

That is complicated.

Centering elements can be achieved with numerous methods. Search for "css image center" to see how many hints and tricks exist.

If your images are centered in the wiki page but not in the PDF you would have to examine

• with what HTML and CSS code the images are centered in the wiki page
• what Confluence CSS code is defined as standard behaviour for images in the PDF export

In the end you have to define your own customized CSS that

• will work together with the HTML of the wiki page
• overwrite the standard CSS code

To answer your question: Yes, you can rewrite this behaviour but it can take a while.