Navigation

See examples of navigation blocks (known as nav blocks), spotlights and other page navigation components.

Nav blocks

Nav blocks should always try to follow heading order. If the heading above the nav blocks is a h2, then the nav blocks should use h3 headings. If there is no heading above the nav blocks then they should use h2 headings.

Image sizes should be cropped to 745px by 468px.

Two in a row

Three in a row

Two in a row, no image

Three in a row, no image

Incomplete rows of nav items

If you have an incomplete row of nav items (for example, 2 items in a 3 column layout) then you must add the class end to the final item in the row. This will left align the item and ensure there are no gaps in the row. For example: