28172 sujets

CSS et mise en forme, CSS3

Bonjour,

en image : avant après
http://www.an16test.org/0/infobulle.jpg
C'est le bouton "?" qui ouvre l'infobulle en mouseover

Mon infobulle est coupée par la div qui est elle même limitée en overflow.

J'aurai aimé que mon infobulle sorte par dessus tout le reste.
C'est le cas si je supprime la gestion de l'overflow de la div.
Mais j'ai besoin de limiter la div.

Voila les codes actuels ci-après.
Bonne journée

abbr.infobulle {
position: relative;
color: black;
text-decoration: none;
cursor:help;
}

abbr:focus {font-size:1em;}

abbr.infobulle span {
display: none; /* On masque l'infobulle. */
}

abbr.infobulle:hover {
background: none; /* Correction d'un bug d'Internet Explorer. */
z-index: 500; /* On définit une valeur pour l'ordre d'affichage. */
}

abbr.infobulle:hover span {
display		: inline; /* On affiche l'infobulle. */
position	: absolute;
width 		: 400px;

  /* white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */

top			: -5px; /* On positionne notre infobulle. */
left		: 10px;

background	: white;

   color	: green;
   padding	: 3px;
   

border		: 1px solid green;
border-left	: 4px solid green;
}

abbr.gauche:hover span {
   left		: -405px;
}


<abbr class='infobulle'><img src='./mes_images/ucp/interrogation.png' align='texttop'><span>Les infos dans l'info bulle.</span></abbr>
Salut

Si tu rajoutes un élément div à l'intérieur de ton infobulle et que tu déclarer ta taille et ton overflow-y dedans ?

comme ça tu sépares le contenant du contenu