13.6.1 Understanding how DITA2Go presents related links

By default, DITA2Go presents links to related topics three ways, depending on the type of relationship:

Parent/Child

Next/Previous

Sibling

Parent/Child

For parent/child links, based on the relationship in the map and regardless of reltable or related-links settings, the parent is listed flush left like this:

Parent topic: Link to topic

The child links are indented, with no heading:

Link to first child

Shortdesc of first child

Link to second child

Shortdesc of second child

Next/Previous

For next/previous links, the treatment is similar to that for parent/child links, with different headings:

Next topic: Link to topic

Previous topic: Link to topic

Sibling

For sibling links, including those in the same row of the reltable, DITA2Go presents lists with a bold heading flush left, and the links under it, also flush left:

Related concepts:

Link to topic

Related tasks:

Link to topic

Related Reference:

Link to topic

Related topics:

Link to topic

You can improve on this presentation with CSS. For example:

<div>
<div class="relinfo"><strong>Related concepts</strong><br/>
<div><a href="DITATestConcept.html" 
title="Overview of Test Suite design.">Test Suite Design</a></div>
</div>
<div class="relinfo"><strong>Related reference</strong><br/>
<div><a href="DITATestReference.html" 
title="DITA features.">Test Suite Coverage</a></div>
</div>
</div>

The CSS is just:

  .relinfo { margin-top: 1em; margin-bottom: 1em }

Previous Topic:  13.6 Formatting links in output

Next Topic:  13.6.2 Labeling related links

Parent Topic:  13.6 Formatting links in output

Sibling Topics:

13.6.2 Labeling related links

13.6.3 Specifying output formats for related and fixed links

13.6.4 Inserting dividers between topics and lists of links