La révolution CSS 2 !

Accueil :: Contact :: Liens
Presentation

Télécharger la CSS

Alors là, on a changé le menu de place, là encore sans toucher au contenu de la page, bien entendu. Pour cela on a juste bidouillé la CSS : changement d'images pour un nouveau style et une légère modification des classes "#nav" et ".contenu" :

    div#nav {
    	position: absolute;
    	width: 150px;
    	margin-top: 5px;
    	margin-left: 608px;
    	border: 1px solid #000000;
    	z-index: 2;
    }

    .lebloccontenu {
    	position: absolute;
    	margin-right: 0px;
    	margin-top: 5px;
    	width: 600px;
    	border: 1px solid #000000;
    	z-index: 1;
    }

Vous remarquerez que seules les marges ont été modifiées.

Le fait que le menu soit extrait du flux (position: fixed ou absolute) permet de changer la position des diverses parties composant la page sans les changer de place dans le contenu HTML.

La CSS comporte aussi une nouveauté :

z-index: 1;

Cette ligne de code permet de définir un ordre de superposition explicitement. Cela devient utile ici car si on laissait faire les choses normalement, les sous-menus apparaitraient sous le contenu, ce qui pourrait être pour le moins ennuyeux...

Suite