Construire un menu en CSS
CHAPITRE 12
161
Créer un menu vertical
La présentation la plus classique est un affichage vertical, chaque lien étant placé
sous le précédent – schéma qui rappelle la disposition classique des blocs dans le flux
normal. L’élément de liste

, de type bloc, adoptera donc par défaut un tel comportement.
Il reste à supprimer les marges internes et externes de la balise

, qui changent
d’un navigateur à l’autre et risquent de poser des problèmes de compatibilité. Spécifions également une police :
La propriété list-style-type porte sur la représentation des puces. La valeur none
les supprime :
La figure 12-2 illustre le résultat intermédiaire ainsi obtenu.
Figure 12–1
Patron de travail
pour le menu
CSS
ul#menu {
margin: 0;
padding: 0;
font: bold 1em Georgia, Times, serif;
}
CSS
ul#menu {
margin: 0;
padding: 0;
font: bold 1em Georgia, Times, serif;
list-style-type: none;
}
Figure 12–2
Embryon de menu
vertical