Problème <span>

Problème <span> - HTML/CSS - Programmation

Marsh Posté le 31-01-2005 à 21:49:09    

Bonjour,
 
J'ai un problème avec le code suivant, les informations affichés dans la balise <span> s'affiche derrière les images.
Comment faire pour les afficher devant les images ?
Merci
 

Citation :

<html>
<head>
<style type="text/css">
.tooltip {
 
}
.img
{
  position: relative;
  z-index: -1;
}
.tooltip .tip{
  position: absolute;
  top: 0px;
  left: 45px;
  width: 200px;
  border: 2px solid #aa9900;
  background-color: #000000;
  text-decoration: none;
  font-size: 12px;
  display: none;
 
}
.tooltip .tip .tooltipline {
float: left;
 width: 100%;
}
.tooltip .tip .tooltipheader {
        float: left;
 width: 100%;
  font-weight: bold;
}
.item {
  position: relative;
  width: 40px;
  height: 40px;
  z-index: 1;
}
 
.weapon0 {
  padding: 16px 0 0 69px;
  float: left;
}
 
.weapon1 {
  padding: 16px 0 0 11px;
  float: left;
}
 
.weapon2 {
  padding: 16px 0 0 10px;
  float: left;
}
 
</style>
<script language="Javascript">
var curTip = "";
 
function displayToolTip(id) {
  if( curTip != "" ) {
    hideToolTip( curTip );
  }
  tip = document.getElementById( id );
  tip.style.display="block";
  tip.style.zIndex=100;
  curTip = id;
}
 
function hideToolTip(id) {
  tip = document.getElementById( id );
  tip.style.display="none";
  curTip = "";
}
 
</script>
</head>
<body>
<div class="weapon0">
<div class="item">
<a class="tooltip" href="#" onMouseover="displayToolTip('1497:0:0:0equipBack')" onMouseout="hideToolTip('1497:0:0:0equipBack')">
<img src=http://www.google.fr/intl/fr_fr/images/logo.gif alt="" width=40 height=40 class=img>
  <span class="tip" id="1497:0:0:0equipBack">
    <span class="tooltipheader" style="color:#9d9d9d">sdfsdf</span>
    <span class="tooltipline" style="color:#ffffff">Dos</span>
    <span class="tooltipline" style="color:#ffffff">sdfsdfs</span>
    <span class="tooltipline" style="color:#ffffff">sdfsdfsd</span>
    <span class="tooltipline" style="color:#ffffff">&nbsp;</span>
  </span>
</a>
</div>
</div>
<div class="weapon1">
<div class="item">
<a class="tooltip" href="#" onMouseover="displayToolTip('1498:0:0:0equipBack')" onMouseout="hideToolTip('1498:0:0:0equipBack')">
<img src=http://www.google.fr/intl/fr_fr/images/logo.gif alt="" width=40 height=40 class=img>
  <span class="tip" id="1497:0:0:0equipBack">
    <span class="tooltipheader" style="color:#9d9d9d">sdfsdf</span>
    <span class="tooltipline" style="color:#ffffff">Dos</span>
    <span class="tooltipline" style="color:#ffffff">sdfsdfs</span>
    <span class="tooltipline" style="color:#ffffff">sdfsdfsd</span>
    <span class="tooltipline" style="color:#ffffff">&nbsp;</span>
  </span>
</a>
</div>
</div>
<div class="weapon2">
<div class="item">
<a class="tooltip" href="#" onMouseover="displayToolTip('1499:0:0:0equipBack')" onMouseout="hideToolTip('1499:0:0:0equipBack')">
<img src=http://www.google.fr/intl/fr_fr/images/logo.gif alt="" width=40 height=40 class=img>
  <span class="tip" id="1497:0:0:0equipBack">
    <span class="tooltipheader" style="color:#9d9d9d">sdfsdf</span>
    <span class="tooltipline" style="color:#ffffff">Dos</span>
    <span class="tooltipline" style="color:#ffffff">sdfsdfs</span>
    <span class="tooltipline" style="color:#ffffff">sdfsdfsd</span>
    <span class="tooltipline" style="color:#ffffff">&nbsp;</span>
  </span>
</a>
</div>
</div>
</body>
</html>


Message édité par Tomef le 31-01-2005 à 21:54:57
Reply

Marsh Posté le 31-01-2005 à 21:49:09   

Reply

Marsh Posté le 31-01-2005 à 21:50:45    

c'est illisible


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed