Sortir du conteneur

r-immo -  
mr_demonicon Messages postés 828 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

J'ai un code du genre :
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>CSS3 tooltip</title>

<style type="text/css">
a.tooltips {
position: relative;
display: inline;
}
a.tooltips span {
position: absolute;
width:140px;
color: #FFFFFF;
background: #000000;
height: 30px;
line-height: 30px;
text-align: center;
visibility: hidden;
border-radius: 6px;
}
a.tooltips span:after {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
margin-left: -8px;
width: 0; height: 0;
border-bottom: 8px solid #000000;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
}
a:hover.tooltips span {
visibility: visible;
opacity: 0.8;
top: 30px;
left: 50%;
margin-left: -76px;
z-index: 999;
}

.contenu{
overflow:hidden;
height:50px;
width:250px;
}
.file{
width:100px;
}
</style>


</head>
<body>
<div class='contenu'>
<div class='file'>
<a class="tooltips" href="#">CSS Tooltips
<span>Tooltip</span></a>
</div>

<div class='contenu'>
<div class='file'>
<a class="tooltips" href="#">CSS Tooltips
<span>Tooltip</span></a>
</div>

<div class='contenu'>
<div class='file'>
<a class="tooltips" href="#">CSS Tooltips
<span>Tooltip</span></a>
</div>

<div class='contenu'>
<div class='file'>
<a class="tooltips" href="#">CSS Tooltips
<span>Tooltip</span></a>
</div>

</div>
</body>
</html>


est-ce qu'il y a un moyen pour que les "tooltips" sortent du conteneur mais pas le reste ?

En gros que l'infobulle puisse sortir du conteneur au survol de la souris mais c'est tout.

merci


1 réponse

mr_demonicon Messages postés 828 Date d'inscription   Statut Membre Dernière intervention   126
 
modifie seulement
.contenu{
	overflow:hidden;
	height:140px;
	width:250px;
        }
0
r-immo
 
hum je n'ai pas été assez clair :/ (ma faute), c'est un code d'exemple, techniquement le nombre de div "file" peut être indéfini.. ^^'

Du coup une valeur fixe ne va pas suffire.
0
mr_demonicon Messages postés 828 Date d'inscription   Statut Membre Dernière intervention   126
 
ben alors met ca
.contenu{
overflow:hidden;
height: 50px;
width:250px;
padding-bottom: 70px;
}
0