Help with multi-tooltip placement

Design help General
1

Hello :slight_smile:

Webflow newbie over here once again seeking help to get unstuck.
My design has a definition tooltip element which triggers when the user hovers over interactive words within a paragraph (i.e. italics with superscript). While I’ve managed to code the tooltip element itself and correctly place it for the first interactive word (i.e. “Hyphae”, see screenshot) I’m really struggling on how to position the other ones.

29
292880×1442 282 KB

I’ve been trying with position:absolute but due to the fluid nature of paragraph text the tooltips never sit where they’re supposed to… Can anyone suggest a solution?

I know I might have to restructure my element hierarchy but I’m not sure how to…

Thanks!

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Perhaps just use tooltipster?

1 Like
3

Thank you for the heads up @dram! I’ll check it out and see if implementing it is a good fix :slight_smile: