Forum How do I...?

Formatting of endnotes that go into the hundreds

suehpec
Hi, we are using Prince 12.4. The book we are using has endnotes that go well into the hundreds. I have been attempting to modify the CSS to get the endnote numbers to align correctly but have not had any success (please see the attached file). If any one has any suggestions I would really appreciate it. I have put the HTML and CSS below.

HTML
<div xmlns="http://www.w3.org/1999/xhtml" id="ftn.id-1.8.6.2.1.4.1" class="footnote"><p><a href="#id-1.8.6.2.1.4.1" class="para">173. </a>My rendering, slightly expanding on a prayer Faber records in his <em class="citetitle">Memoriale</em> as one he would offer to the laity while distributing the Eucharist at Mass. See <em class="citetitle">The Spiritual Writings</em>, 284.</p></div>

CSS
/* Endnotes in back of book*/
div.footnote {
margin-bottom: 8pt;
}

div.footnote p, div.endnotes p {
text-align: left !important;
text-indent: 15pt hanging;
line-height: 12.5pt;
hyphens: none;
font-size: 9.5pt;
}

.inline-footnote-marker {
vertical-align: super;
line-height: -6px;
font-size: 70%;
}

/* Use this section INSTEAD when using on-page footnotes instead of endnotes */
@page {
@footnotes {
margin-top: 14pt;
border-top: solid black thin;
padding-top: 6pt;
}
}

.onpage-footnote {
float: footnote;
counter-increment: footnote;
margin-right: 12pt;
margin-bottom: 1pt;
text-indent: 0; /*12.5pt hanging;*/
text-align: left;
line-height: 10pt;
font-size: 8pt;
hyphens: none;
}

/*Footnote calls are the numeric anchors in the text that refer to the footnotes
If you want footnote number in brackets use this content: "[" counter(footnote) "]"*/
.onpage-footnote::footnote-call {
content: counter(footnote);
line-height: none;
font-size: inherit;
vertical-align: super;
}

/*Numeric markers placed in front of the footnote text
Turn off decimal after number in ControlPanel.xsl, footnote.body.marker.after*/
.onpage-footnote::footnote-marker {
padding-right: 4px;
}
  1. footnotes over 100.jpg333.0 kB
    Numbers do not align correctly.
jim_albright
One of the secrets of perfect alignment is to actually put a digit there like 099. Next problem is to hide the 0 so format an initial 0 as color white. That will move all of the digits into alignment. You should also have the problem between 9 and 10 so make them 009 and 010.

One really could argue that they are in perfect alignment - with left edge already.

Jim Albright
Wycliffe Bible Translators

Edited by jim_albright

mikeday
Give them a fixed width and right align them?
suehpec
Thank you for the tips! I will give them a try.