Place caption below image

Having trouble installing <oXygen/>? Got a bug to report? Post it all here.
Posts: 33
Joined: Tue Feb 20, 2018 2:51 pm

Place caption below image

Post by anna_craneo » Wed May 16, 2018 6:24 pm


I use CSS for my DITA->PDF transformation and would like to place image caption within the <fig> element below the image itself. I tried it this way but it does not work.

Code: Select all

This centers the title text and the image if the image has the
placement attribute set to inline. The inline placement is the the default.
*[class ~= "topic/fig"] {
text-align: center;


/* Other images, with break placement. */
*[class ~= "topic/image"][placement = 'break'] {
display: block;
text-align: center;
order: 1;

*[class ~= "topic/fig"] > *[class ~= "topic/title"]{
font-style: italic;
font-size: 12px;
text-align: center;
display: flex;
flex-flow: column;
order: 2;
Many thanks for any help

Posts: 447
Joined: Mon Feb 03, 2003 10:56 am

Re: Place caption below image

Post by Dan » Thu May 17, 2018 3:36 pm

Unfortunately the flex CSS layout is not supported by the Chemistry PDF processor.

I recommend making a change in the XSLT pipeline. Please locate the file "post-process.xsl" in your oXygen installation (the framewords/dita/DITA-OT2.x/plugins/com.oxygenxml.pdf.css/xsl folder) and add the following XSLT template:

Code: Select all

<xsl:template match="*[contains(@class,' topic/fig ')]">
<xsl:copy-of select="@*" />
<xsl:apply-templates select="*[not(contains(@class,' topic/title '))]" />
<xsl:apply-templates select="*[contains(@class,' topic/title ')]" />
In the next oXygen version we will add a new parameter to the WYSIWYG pdf-css transformation scenario: "figure.title.placement" with values "top" and "bottom". Until then, please use the above fix.

Many regards,

Post Reply