CODEWITHSUNDEEP
htmlxmlxsltxsl-fo
flitz
flitz

Reputation: 23

XSL-FO table-cell with superscript and vertical alignment

This is the situation: I am converting html to xsl-fo to pdf. I am displaying a heading text like "4.4.1. [Header Text]" by use of a table, because it might happen that the [Header Text] is quite long and in that case shall wrap onto the next line like so:

[table-row]
     [cell with numbering]  [cell with header text]
[/table-row]

There are 4 different cases how the header may be composed:

  1. header text single line
  2. header text wraps onto next line
  3. header text single line with superscript
  4. header text wraps onto next line with superscript

The problem is that superscript will increase the row's height and mess with the vertical text alignment. This is how it would look by default in all 4 cases:

__________________________
|_1.2.3_|_header_text____|      <<< OK

__________________________
| 1.2.3 | long long long |      <<< OK
|_______|_header_text____|

__________________________
| 1.2.3 |            (1) |      <<< NOT OK
|_______|_header_text____|

__________________________
| 1.2.3 | long long long |      <<< OK
|       |            (1) |
|_______|_header_text____|

As you can see, in case no.3 the numbering and most of the header text are not aligned in a nice way.

I could solve case no.3 by using display-align="after" on the table-cell with the numbering. But in order not to mess up the other 3 cases, I would need to determine whether the content of the header text will wrap onto the next line or not. The font I am using for output is not monospaced, this is why counting characters would be an approximation, at best.

My question is, how it could be done so that case 3 looks like:

__________________________
|       |            (1) |
|_1.2.3_|_header_text____|

while the others stay the same.

Thanks!

EDIT: example of the markup for case 3

<fo:table font-size="18pt" font-weight="bold" font-style="italic" space-after="2mm" space-before="7mm" keep-with-next.within-page="always">
    <fo:table-column column-width="16mm"/>
    <fo:table-column/>
    <fo:table-body>
        <fo:table-row>
            <fo:table-cell>
                <fo:block>1.2.3</fo:block>
            </fo:table-cell>
            <fo:table-cell>
                <fo:block>
                    <fo:block text-align="left">
                        <fo:block>Header Text (<fo:inline baseline-shift="super">1</fo:inline>)
                        </fo:block>
                    </fo:block>
                </fo:block>
            </fo:table-cell>
        </fo:table-row>
    </fo:table-body>
</fo:table>

EDIT 2: I tried to reverse the superscript-logic:

This "worked", I tested it for cases 3 + 4 and the heading text was in-line with the numbering in both cases.

But it has the drawback that I get a little extra spacing on top of the heading and that I would have to twist around to completely revert the superscript settings in the heading.

Upvotes: 0

Views: 2643

Answers (2)

Tony Graham
Tony Graham

Reputation: 8068

Use relative-align="baseline" (see https://www.w3.org/TR/xsl11/#relative-align). Since it's inherited, you could put it on the fo:table-row or even the fo:table if you wanted.

With relative-align="baseline", the first lines in each fo:table-cell are aligned to the same baseline. The superscript in Case 3 effectively pushes down the baseline of the first line in its fo:table-cell, and the baselines in the other fo:table-cell will be aligned to match the lower baseline.

Upvotes: 0

Andreas
Andreas

Reputation: 1250

You are using an fo:inline element to wrap your superscript text, I suppose. If you change the line-stacking-strategy from default max-height to font-height, there won't be a gap from superscript. Try: 

<fo:inline vertical-align="super" line-stacking-strategy="font-height">Your superscript text here</fo:inline>

Edit: I put line-stacking-strategy in the parent block too which was actually causing the effect. I tested with Altsoft's renderer XML2PDF: 

<fo:block line-stacking-strategy="font-height">Header Text <fo:inline baseline-shift="super">(1)</fo:inline>

To get the exact same baseline, I suggest to use it for the previous field too: 

<fo:block line-stacking-strategy="font-height">1.2.3</fo:block>

Upvotes: 1

Related Questions