Aide sur le tutoriel "Menu horizontal coulissant"

Bonsoir à tous,

Dans le but de faire mon propre design, j'essaye d'utiliser le tutoriel sur la création de menus horizontaux. Je tente la méthode du menu coulissant, à savoir l'exemple ici-même.

Voici le rendu final :

http://img191.imageshack.us/img191/2461/pourdecoupe.png

A gauche, c'est le lien en hover et active. A droite, c'est le lien "par défaut", sans survol.

J'ai donc fait mon PNG avec les 2 flèches intégrées :

http://img704.imageshack.us/img704/9141/menucoulissant.png

Et voici mon CSS :

#intra-menu {
	list-style: none ;
	margin: 0;
	padding: 20px 0 0 0;
	overflow: hidden ;
	height: 49px;
}
#intra-menu li {
	float: left;
	width: 150px;
	margin-right: 1px ;
	color: #fff ;
	}
#intra-menu li a {
	display: block;
	background: url(menu-coulissant.png) left bottom no-repeat;
	color: #fff;
	line-height: 1em;
	padding: 4px 0;
	text-align: center ;
	text-decoration: none ;
	}
#intra-menu li a:hover, #nav li a:focus, #nav li a:active {
	background: url(menu-coulissant.png) right bottom no-repeat ;
	text-decoration: underline ;
	}

L'ennui, c'est le rendu actuel :

http://img684.imageshack.us/img684/9345/sanstitre9n.png

La totalité de l'image est affichée à gauche du lien, et au hover, ca se déplace à droite (exemple sur le dernier lien).

Avez-vous une idée ?

Bonne soirée !
Modifié par Jeoffrey54 (13 Jan 2010 - 22:41)

Bonjour , cela ressemble étrangement a un de mes thème simplifié que j'utilise pour une version de Pluxml patché et libre de droits .

http://www.doc-css.com/plx4.3urw/demo/

je n'utilise ni la méthode des portes coulissantes ni un png , tu peut t'inspirer du css utilisé ou copier la structure du menu et sa partie style , les couleur et tailles des puces semblent même similaires tu peut t'en servir aussi , je ne vois rien d'exceptionnel a ce menu des plus classique qui mériterait de s'en approprié la paternité vu qu'il ne s'agit que d'un gradient de base et un élément de puce .. aussi de base .

Je serais curieux de voir l'ensemble de la page ou il se trouve

Cordialement , GC

<edit ps=" exit le png pour une compatibilité IE6 par exemple , la simplicité du graphisme ne necessite que de trés petites images , d'ou mon choix ." />
Modifié par gc-nomade (14 Jan 2010 - 01:33)

Bonjour,

En effet, le menu est exactement le même. En revanche, le reste est totalement différent de ton design .

Je vais m'inspirer ton menu pour le mien

Je t'envoie par MP un aperçu de mon design, car pour l'instant, pas de version public.

Bonne journée et merci
Modifié par Jeoffrey54 (14 Jan 2010 - 20:55)