Info-bulle d'amorçage à l'intérieur de la cellule de la grille d'agencement montrant partiellement

Question

J'essaie de montrer une info-bulle de bootstrap dans une cellule de maillage en vol stationnaire. Le problème est qu'il apparaît partiellement alors qu'une partie de l'info-bulle se trouve derrière la cellule de colonne suivante. J'ai essayé de définir z-index pour l'info-bulle. Mais toujours pas capable de réussir. Aide aimablement.

Answer 1

Avez-vous un violon ou un plnkr à regarder? Vous pouvez utiliser l'infobulle css qui fonctionnera dans les cellules agGrid. Jetez un oeil à ce plnkr tooltip in agGrid cell

[data-tooltip]:before { 
    content: attr(data-tooltip); 
    display: none; 
    position: fixed; 
    margin:10px 10px 10px 10px; 

}

Answer 2

Essayez d'utiliser l'option tooltip-append-to-body="true" pour infobulle bootstrap.

Answer 3

Dans la documentation NGX-bootstrap:

Lorsque vous avez des styles sur un élément parent qui interfèrent avec une info-bulle, vous devrez spécifier un conteneur = « corps » de sorte que le code HTML de l'info-bulle sera annexé au corps. Cela vous aidera à éviter des problèmes de rendu dans plusieurs composants complexes (comme nos groupes d'entrée, des groupes de boutons, etc.) ou des éléments à l'intérieur avec overflow: hidden

Vous pouvez utiliser l'attribut container="body" pour résoudre le problème