VERTICAL NAVIGATION BAR

Vertical Navigation Bar

To build a vertical navigation bar we only need to style the <a> elements, in addition to the code above:

Example

a
{
display:block;
width:60px;
}

Example explained:

• display:block - Displaying the links as block elements makes the whole link area clickable (not just the text), and it allows us to specify the width
• width:60px - Block elements take up the full width available by default. We want to specify a 60 px width

HINT: Always specify the width for <a> elements in a vertical navigation bar. If you omit the width, IE6 can produce unexpected results.