Modification de classes

Je voudrais installer un menu ressemblant à celui du tuto d'alistapart, mais le probleme, c'est que je n'arrive pas à le modifier.
En fait, le code du style est général pour toutes les balises ul, li... Mais bien sur, ça ne marche que sur une page vide.Si je la met sur mon site, ça fait bugger toutes mes listes...
Voila la page que j'ai faite en attendant : http://www.toutankharton.com/menu.htm
comment faire pour que le code ne soit interprété que pour une classe par exemple ? C'est trop compliqué pour moi...
Merci d'avance, et bravo pour ce nouveau forum ;)

Tu dois tout simplement mettre #nav dans le code CSS
Dans ton code html, ul a pour ID "nav" donc on met en forme l'ul ayant pour id "nav"

body {
	font: normal 11px verdana;
	}

[#red]#nav[/#], [#red]#nav[/#] ul{
	margin: 0;
	padding: 0;
	list-style: none;
	width: 150px; /* Width of Menu Items */
	border-bottom: 1px solid #ccc;
	position: relative;
	}

[#red]#nav[/#] li {
	position: relative;
	}
	
[#red]#nav[/#] li ul {
	position: absolute;
	left: 149px; /* Set 1px less than menu width */
	top: 0;
	display: none;
	}

/* Styles for Menu Items */
[#red]#nav[/#] li a {
	display: block;
	text-decoration: none;
	color: #777;
	background: #fff; /* IE6 Bug */
	padding: 5px;
	border: 1px solid #ccc;
	border-bottom: 0;
	}

/* Fix IE. Hide from IE Mac \*/
* html [#red]#nav[/#] li { float: left; height: 1%; }
* html [#red]#nav[/#] li a { height: 1%; }
/* End */

[#red]#nav[/#] li a:hover { color: #E2144A; background: #f9f9f9; } /* Hover Styles */
		
[#red]#nav[/#] li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
		
[#red]#nav[/#] li:hover ul, li.over ul { display: block; } /* The magic */

Modifié le 27 Oct 2004 - 23:21

Merci de répondre si rapidement :)
Malheuresement, j'y avais déjà pensé, ça ne marche pas, d'ou mon message sur ce forum...
Pour info, ça donne ça : http://www.toutankharton.com/menu.htm

En fait j'imagine qu'on est sur la bonne voie, mais il doit y avoir un autre truc a modifier... Tu voit ou est l'erreur ?