Lignes horizontales dans la navigation dynamique

Question

J'ai besoin de développer un menu de navigation vertical en utilisant une bibliothèque jQuery qui lui donnera des capacités de vue arborescente. L'astuce que je rencontre dans les problèmes est que le menu doit être multiligne (c'est-à-dire word-wrap: normal sur chaque ancre) et avoir des lignes horizontales qui le traversent. Chaque méthode que j'ai essayée fait que les lignes apparaissent bizarrement ou que les icônes d'ouverture/fermeture de l'arborescence ne s'affichent pas correctement. J'ai également besoin de la compatibilité IE6 +. J'utilise la bibliothèque jsTree jQuery pour l'arborescence et j'applique mon propre CSS au mixage. J'ai essayé 4 méthodes différentes de l'obtenir au travail mais here is my current attempt. L'afficher dans Firefox ou IE8 produit les meilleurs résultats, mais d'autres navigateurs ont des problèmes différents.

Answer 1

Avez-vous essayé

#leftnav li { 
    border-bottom: 1px solid #FFF; 
} 

Il est juste une bordure blanche de base sur le fond de chaque entrée <li>. C'est très simple, mais c'est comme ça que je le ferais probablement. Selon votre couleur de fond <li> choisie, vous pouvez varier la couleur de la bordure. Vous pouvez même faire cela en définissant le style et l'arrière-plan de chaque niveau de tag <li>.