image en background ne s'affiche pas
salut,
je veux créer des infos bulles avec une imae en background, mais le problème que le contenu de l'infobulle s'affiche mais l'image je le vois plus :(.
le voila le fichier sp.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 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
| a.info {
position:relative; /* Très important */
background:none; /* Important pour le fonctionnement sur IE */
z-index:10;
}
a.info:hover {
z-index:20;
}
a.info span {
display:none;
}
a.info:hover span { /*la tag SPAN apparaitra avec l’effet hover*/
display:block;
position:absolute;
top:18px;
left:10px;
/* Éléments pour positionner le texte dans la bulle */
/* Vous pouvez aussi utiliser le padding:24px 8px 5px 25px; */
padding-left:25px;
padding-top:24px;
padding-bottom:5px;
padding-right:8px;
width:205px;
height:45px;
/* Style du character dans la bulle */
font-family:Arial, Helvetica, sans-serif;
font-weight:normal;
font-style:italic;
font-size:10px;
color:#999999;
text-decoration:none;
text-align:justify;
}
/* Pour avoir un beau background de bulle avec PNG transparent*/
a.info:hover>span {
background-image:url(imgs/bgInfo.PNG);
}
a.info:hover span {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/imgs/bgInfo.PNG",
sizingMethod="crop");
} |
le code html:
Code:
1 2 3
| <a href="#" class="info">Le nom de votre lien
<span>La description de votre lien avec un maximum de 130
caractère dans ce cas si</span></a> |
merci d'avance