The typical unordered list as the navigation: <ul id="nav">
<li><a href="#nav"> Navigation</a></li>
<li><a href="#descr"> Description</a></li>
<li><a href="#html"> <abbr title="Hyper Text Markup Language">HTML</abbr></a></li>
<li><a href="#css"> <abbr title="Cascaded Style Sheet">CSS</abbr></a></li>
</ul>
The trick is to make it look like a table but don't use one, because tables are considered to
be bad. A little eye candy is the showing trough background. It's a repeated PNG with a single translucent blue pixel. The
important CSS: ul#nav
{
position:fixed;
top:10%;
right:5%;
list-style-type:none;
border:outset 5px #0000FF;
padding:5px;
background-image:url(trans_pix.png);
display:table;
}
ul#nav>li
{
text-align:center;
width:5em;
padding:2px 1em;
display:table-cell;
}
ul#nav>li>a
{
color:#FFFFFF;
font-weight:bold;
}
ul#nav>li:hover
{
background-color:#FFFFFF;
}
ul#nav>li:hover>a
{
color:#0000FF;
}
The translucent background will fail with MS IE.