Table of Contents styling

To give your edition a little bit extra spice, consider styling the Table of Contents (TOC). You can do this using CSS in the Edition Settings.

Example CSS
Below is an example snippet of CSS to customize the TOC:

/* the background of the entire TOC and the border of it to the right */
#container nav#articleIndex {
    background-color: white;
    border-right: 1px solid rgb(0, 125, 162);
}

/* the font that is used inside the TOC, optionally remove the bottom margin */
#container nav#articleIndex ul li {
    font-family: 'Frutiger';
    margin-bottom: 0;
}

/* the color of the lines below each TOC entry and the link color of the text */
#container nav#articleIndex ul li a {
    border-bottom-color: rgb(0, 125, 162); 
    color: rgb(0, 125, 165);
}

/* the background color and link color of an active or highlighted TOC entry */
#container nav#articleIndex ul li.active a, #container nav#articleIndex ul li a:hover {
   background-color: rgb(0, 125, 162); 
   color: white;
}
Last modified: