Je n'arrive pas à résoudre un problème de syntaxe html.
Il s'agit d'un menu ou plusieurs éléments sont imbriqués :
Une <div> contient le menu.
Ce menu se compose d'images, au survol de chacune des images une infobulle apparait et en cliquant sur l'image, on ouvre le lien.
Voici à quoi ressemble mon code
Le système fonctionne mais n'est pas validé par le W3C...
Si je remplace pour :
le bouton n'apparait plus...
Coté CSS voici à quoi ressemble mon bouton :
Si quelqu'un sait m'éclairer, je lui serais très reconnaissant
Modifié par Benkusz (28 Jun 2012 - 17:55)
Il s'agit d'un menu ou plusieurs éléments sont imbriqués :
Une <div> contient le menu.
Ce menu se compose d'images, au survol de chacune des images une infobulle apparait et en cliquant sur l'image, on ouvre le lien.
Voici à quoi ressemble mon code
<a href="PageX.php">
<div class="tip" onmouseover="tooltip('Nom de la page');"onmouseout="exit();">
<div id="Boutons_PageX"></div>
</div>
</a>
Le système fonctionne mais n'est pas validé par le W3C...
Si je remplace pour :
<a href="PageX.php">
<span class="tip" onmouseover="tooltip('Nom de la page');"onmouseout="exit();">
<span id="Boutons_PageX"></span>
</span>
</a>
le bouton n'apparait plus...
Coté CSS voici à quoi ressemble mon bouton :
#Boutons_PageX{
margin-right: auto;
margin-left: auto;
margin-top:5px;
margin-bottom:10px;
width:100px;
height:100px;
/* COINS ARRONDIS */
-webkit-border-radius: 60px; /* Saf3-4, iOS 1-3.2, Android =1.6 */
border-radius: 60px; /* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ */
/* useful if you don't want a bg color from leaking outside the border: */
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
/* OMBRE PORTÉE */
-webkit-box-shadow: -1px -1px 1px 0 rgba(171,175,255,0.6) inset, 3px 3px 10px rgba(0,0,0,1) inset; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
box-shadow: -1px -1px 1px 0 rgba(171,175,255,0.6) inset, 3px 3px 10px rgba(0,0,0,1) inset; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
background-image: url(images/Boutons/Boutons_PageX.jpg);
}
#Boutons_PageX:hover{
background-image: url(images/Boutons/Boutons_PageXHover.jpg);
}
#Boutons_PageX:active{
background-image: url(images/Boutons/Boutons_PageXActive.jpg);
}
Si quelqu'un sait m'éclairer, je lui serais très reconnaissant
Modifié par Benkusz (28 Jun 2012 - 17:55)