Déplacement de la liste interne : absolue

La définition du positionnement en absolute permet de faire quitter le flux à la liste de la liste.

Sa position de ré-apparition permet de plus de décaler à la position voulue la liste interne.

div#nav ul {margin: 0; padding: 0; width: xem;}

div#nav li {position: relative;}

div#nav ul ul {position: absolute; top: 0; left: xem;}

remarque : Les sous listes revenant au dessus de la liste principale se chevauchent.

code en action

La définition de relative pour li est dû à un problème que nous avons déjà rencontré.

Voici le résultat sans position:relative

code en action

Pour aller encore plus loin sur cette question importante de la recherche du bloc "static", voici le résultat du css suivant :

div#nav ul {

margin:0;

padding:0;

width:7em;

position:relative;

}

div#nav li {

list-style-image:none;

list-style-position:outside;

list-style-type:none;

margin:0;

position:relative;

}