[CSS] li et z-index

Version imprimable

[CSS] li et z-index

le css :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
ul li {
       margin-left:-13px;
       float:left
}
 
li#menu1 {
	width:97px;
	z-index:100;
}
 
li#menu1 a{
	background:url(../images/menu_1.gif) top left no-repeat;	
}
 
li#menu1 a:hover{
	background:url(../images/menu_1_f2.gif) top left no-repeat;	
}
 
li#menu2 {
	width:141px;
	z-index:1;
}

le bout du html

Code:

1
2
3
4
5
6
7
 
<ul>
		<li id="menu1"><a href="#"><img src="images/spacer.gif" /></a></li>
		<li id="menu2"><a href="#"><img src="images/spacer.gif" /></a></li>
		<li id="menu3"><a href="#"><img src="images/spacer.gif" /></a></li>
		<li id="menu4"><a href="#"><img src="images/spacer.gif" /></a></li>
	</ul>

le probleme c'est que le li#menu1 reste tjrs en dessous de li#menu2

y a t il une solution

merci

18/08/2005, 16h18
Perceval

C'est bien d'avoir le problème.... mais si on ne sait pas ce que tu veux faire exactement ca va êter difficile de donner des solutions... :wink:
18/08/2005, 16h44
radimby

Bon, le but de ce code c'est simple:

je veux avoir ceci :
http://hitechs.tollfreepage.com/upload/sary/menu_ok.gif

mais le resultat du code c'est ceci :
http://hitechs.tollfreepage.com/upload/sary/menu_ko.gif
18/08/2005, 16h47
Perceval

euh...... ca n'affiche rien... les liens ne doivent pas être bons.... :wink:
18/08/2005, 16h48
glloq8

En faisant clic droit afficher l'image, moi je les ai eu !
18/08/2005, 16h50
radimby

Copier l'adresse de l'image et visualiser le sur IE ou FF, et tu verras, ça ne pese que 2 ko chacun
18/08/2005, 17h22
radimby

Et bien, merci pour tous.

la solution etait de mettre les li en position:absolute, et de les placer un à un en specifiant le style left

8)
19/08/2005, 09h42
glloq8

C'est cool, en disant qu'on ne voit pas les images, le problème est résolu !