El menú
El menú tiene un poco de truco. Para empezar, se hace una lista con los enlaces en html de esta forma:
Código HTML:
<div id="nav">
<ul>
<li><a href="pasados.php">Pasados</a></li>
<li class="selected"><a href="index.php">Actuales</a></li>
<li><a href="proximos.php">Próximos</a></li>
</ul>
</div>
Después, agregas el siguiente CSS:
Código:
#nav li{display:inline}
#nav a{color:#333;background:#f66;text-decoration:none;display:inline-block;width:10em;padding:0.5em}
#nav li.selected a{width:16em;padding:1em}
De esta forma, cada uno estará alineado delante del siguiente.
La clase "selected" se la debes de dar al enlace que actualmente está seleccionado, para que tenga ese efecto diferente. Si tienes alguna duda en el camino, no dudes en preguntar, pero para enseñar estamos en este foro ;)