Horizontal Navigation (Without Secondary Navigation - Truncated Tabs)

Developer Notes

See the standard horizontal navigation pattern for implementation notes.

To switch to truncated tabs you need to do three things:

• Truncate the length of the anchor text to whichever length fits all of your tabs in the container. In the example above the tab name strings have been truncated to 8 characters (the word primary plus a space). This should be done server-side, but it could be done client-side via JavaScript if necessary.
• Add the ellipsis (...) to the end of the link content.
• Add a title attribute to the link with the full tab label as its content (Primary Navigation in the example above).