Caratteristica: minimaliste, menu verticale a destra, larghezza fluida
Ce gabarit est une variante du Gabarit 04. Il a la même structure HTML, et il utilise les mêmes feuilles de style.
La seule modification apportée aux styles CSS se trouve dans le code de cette page. La voici:
<style type="text/css" media="screen">
#navigation {
float: right; /* On fait flotter le menu à droite plutôt qu'à gauche */
}
#contenu {
margin-left: 0; /* On remet à zéro la marge de gauche du contenu... */
margin-right: 20%; /* ... et on utilise la même marge, à droite */
}
</style>
Passer notre menu à droite est donc un jeu d'enfant.
Cette variante sert avant tout à illustrer le fonctionnement du positionnement flottant. En pratique, il est préférable de ne pas placer un menu de navigation tout à droite de la page.
En effet, la plupart des sites web ont un menu de navigation horizontal sur toute la largeur du site, ou un menu de navigation vertical situé à gauche. C'est une convention à laquelle les internautes sont habitués. En plaçant votre menu de navigation à droite (ou tout en bas, ou en plein milieu de votre contenu…), vous prenez le risque d'avoir un menu peu visible, et donc une mise en page inefficace!
Mise en page © 2008 Elephorm et Alsacréations