Bonjour, bonsoir,

je développe une application de gestion interne de plannings, et sur ces derniers, il est possible d'avoir un commentaire pour un salarié, une date et un créneau donnés. Pour mieux comprendre:

Nom : glyphicon.png
Affichages : 80
Taille : 14,0 Ko

Comme vous pouvez le voir, quand mon curseur est sur un glyphicon, un commentaire s'affiche mais sur ce commentaire, la glyphicon inférieur apparaît par-dessus le commentaire, je souhaite l'inverse.

J'ai pourtant utilisé la propriété 'z-index':

Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
/* Span de commentaire */
.commentaire {
	position: relative;
	z-index: 1;
	width: 15px;
	float: right;
}
 
/* affichage d'un commentaire */
p.commAffiche{
	background-color: #cccccc;
	padding-bottom: 4px;
	padding-left: 1px;
	padding-right: 1px;
	z-index: 2;
}
 
/* Saisie / modif d'un commentaire */
p.commSaisie{
	margin-left: -147px;
	z-index: 2;
}
 
/* icone des commentaires */
.glyphicon{
	z-index: 1;
}

Mais rien n'y fais. Je vous met également la partie HTML / PHP:

Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
 
<?php
	foreach ($plannings as $p) {
		$class = $css[$l%2][$c%2];
		//Si le reste de $i divisé par 10 = 0 alors 10 boucles sont passées et une ligne est remplie (5 jours séparés en 2 créneaux), on passe donc au salarié suivant (ligne suivante)
		if ($i%10 == 0) {
			echo "</tr>";
			$l++;
			$c=0;
			echo "<tr>";
			echo "<td class='tableInfo'> <input type='hidden' name='salarie[]'' value='".$p->getSalarie()->getNumSalarie()."'>" .$p->getSalarie()->getNomSalarie()." ".$p->getSalarie()->getPrenomSalarie()."</td>";
		}
		echo "<td class='".$class."'>";
		echo $p->getChantier()->getNomChantier();
		echo "<br>";
		echo $p->getVehicule()->getNomVehiculeABRG();
		if (!is_null($p->getCommentaire() ) ) {
			echo "<div class='commentaire'>";
				echo "<span class='glyphicon glyphicon-info-sign' onmouseover='showComm(this)' onmouseout='hideComm(this)'>";
					echo "<p style='display:none' class='commAffiche'>";
						echo $p->getCommentaire();
					echo "</p>";
				echo "</span>";
			echo "</div>";
		}
		echo "</td>";
		$c++;
		$i++;
	}
	?>

Ce problème devient ma bête noire, alors merci d'avance de votre aide!

Cordialement,
Skunka.