Hello,

I am using this style for the TOC:

#toc a[href] {
content: content() leader('.') target-counter(attr(href), page);
font-style: normal;
position: relative;
top: 0;
right: 0;
text-decoration: none;
}

It works ok, but when there is more than one line in the chapter name, I would like to add some margin-right in the first line(s), but not in the last line where the page numer is. Please see screenshot enclosed.


Thanks!

1. toc.png‎ 46.0 kB

Try adding

#toc { padding-right: 24pt; }
#toc a[href] { margin-right: -24pt; }

so that the end of each <a> element sticks out beyond the content box of its block (thanks in part to the leader()).

thanks, it works perfect!

just one final query regarding this: how can I change the space between the number of the chapter and the title of the chapter? Right now, the space seems to be a tab, but I would need a simple space.
So, instead of having:

1. Chapter title

I would need:

1. Chapter title

Thanks!

There's nothing in the ruleset you've quoted that inserts any space or number, it's just taking text from the main docu; what rulesets do you have to generate content within the #toc a elements (and similarly for the h1 etc. elements, if #toc a element content is taken from h1 element content) ? Or is it generated by xslt or the like before Prince sees it?

thanks for your prompt reply. The CSS lines related to the toc are these. Please let me know.
--------
.toc h1 {
text-align: center
}
#toc a {
border: none;
}
#toc ul, #toc li {
list-style: none;
margin: 0;
padding: 0;
text-align: left;
}
#toc li {
position: relative;
}

#toc .part {
margin: .6cm 0 .7em;
/*text-align: center;*/
page-break-after: avoid;
}
#toc .part.invisible {
display: none;
}
#toc {
page-break-before: right;
counter-reset: part;
font-size: 10pt;
}
#toc ul {
counter-reset: chapter;
line-height: 1.2em;
}
#toc ul li {
margin-bottom:5px;
}
#toc .part a::before {
content: " ";
counter-increment: part;
}
#toc .chapter a {
padding-left: 25px;
}
#toc .chapter a::before {
content: counter(chapter) ". ";
counter-increment: chapter;
margin-right: 7pt;
position: absolute;
left: 0;
top: 0;
}
#toc .chapter.numberless a::before {
content:'' ;
counter-increment: none;
margin-right: 0;
}
#toc .part a::after {
content:'' ;
}

#toc span {
hyphens: none;
}

#toc span.chapter-author,
#toc span.chapter-subtitle {
display: inline-block;
font-style: italic;
margin-left: 2em;
width: 80%;
}
#toc span.toc-chapter-title {
display: inline-block;
width: 80%;
}
#toc span.chapter-author,
#toc span.chapter-subtitle {
/*margin-bottom: 5px;*/
margin-bottom:0px;
}
#toc span.chapter-subtitle +
span.chapter-author {
margin-top:5px;
margin-bottom:0px;
}

#toc a[href] {
content: content() leader('.') target-counter(attr(href), page);
font-style: normal;
position: relative;
top: 0;
right: 0;
text-decoration: none;
}

#toc li.back-matter.first {
margin:.6cm 0 .7em
}

Judging solely from the above without looking at the corresponding document, it would seem that the chapter number is generated by the "#toc .chapter a::before" rule. The position [i.e. location on the page] of this chapter number is determined by the "position: absolute;left: 0;top: 0;" part: see http://www.w3.org/TR/CSS2/visuren.html#propdef-left. See http://www.w3.org/TR/CSS2/visudet.html#containing-block-details for how to determine what that 'left:0' is relative to, but the style sheet suggests that it's intended to be positioned relative to a #toc li element.

The position of the rest of the text of the ToC entry is determined mainly by the "#toc .chapter a { padding-left: 25px; }" ruleset. In particular, the fact that the number was made to be absolutely positioned means that it's not influenced by the number at all (as per http://www.w3.org/TR/CSS2/visuren.html#absolute-positioning). (The 'margin-right' declaration on the a::before has no effect on the layout that I can think of; it might be a left-over from a previous approach to positioning, perhaps before adding the "position: absolute".)

This approach to positioning makes me think that the large gap is sort of deliberate: I think the intent is that the chapter titles (as distinct from the chapter numbers) align on their left side even for chapters with a different number of digits (such as chapters 9 and 10). If I've correctly guessed the structure of the document, then I expect that reducing the aforementioned "padding-left: 25px" declaration's value would reduce the gap, but you'd have to make sure that things still look good for chapter 10 (or chapter 100 if there is one).

Another approach you might consider would be to add "width: 25px; text-align: right;" to the #toc .chapter a::before ruleset: this would keep the chapter titles lined up as at present, but would make the numbers align their right edges instead of their left edges. (Consider also commenting out or removing the 'margin-right' declaration in that same a::before ruleset, just so as not to be misleading as to its effect.)

These suggestions are based on guesses as to the document's element structure in the ToC, without testing. Though hopefully what I've said is still of some help in working out what's happening and how to make things do what you want.

thanks!