HTML + CSSInfo-bulles

Infobulle latérale élastique

Elle jaillit à droite de l'icône, reliée par une fine tige qui s'étire à l'ouverture.

Réglages

16px
1x

Code

<button class="uv-tl">↗<span>Partager le lien</span></button>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Plus dans Info-bulles

Où l’utiliser

Les infobulles latérales sont faites pour les mises en page verticales : la barre d'icônes repliée d'un CRM, la barre de partage flottante à côté d'un article de blog, la colonne d'outils d'un éditeur photo. Au-dessus des icônes, le libellé cacherait le voisin ; sur le côté, tout reste dégagé. La tige donne à ce tooltip CSS un petit effet élastique.

Elle s'ouvre vers la droite : gardez-la pour les barres collées au bord gauche, et inversez-la pour un panneau à droite. La tige prend votre première couleur ; un ton discret évite qu'elle ressemble à une flèche pointant ailleurs.