Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

123
Views
Popper/Tippy prohibit overflow of other elements

I'm using Tippy to create tooltips for options that configure a belt, but the tooltip overlaps the belt preview (See below).

It currently looks like this, when it overflows the main belt preview: http://snpy.in/Btw2ZP

But I'd like to adjust the maximum height for it to look like it goes out of bounds: http://snpy.in/j43oIl

This functionality is already built in when the Tooltip is higher than the screen, it then pops down. I want to make it do it sooner. Is there a way to configure this?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I'm not 100% sure if this is what you're asking, but you can set the maximum height of the tooltip by adding CSS to the tooltip. Tippy.js is just a lightweight tooltip-focused wrapper Popper.js, so all of Popper's configuration apply as well to Tippy.

Here is Popper's documentation on editing Tooltip styles: https://popper.js.org/docs/v2/tutorial/#styling

You can also just add a class to Tippy's HTML content with a max-height CSS rule: https://atomiks.github.io/tippyjs/v6/html-content/

This functionality is already built in when the Tooltip is higher than the screen, it then pops down. I want to make it do it sooner. Is there a way to configure this?

No, there doesn't appear to be a way to configure this. There is no mention of this in either Tippy's documentation, or Popper's (the underlying engine used by Tippy). Your best shot at this is either playing with the tooltip's content height or max-height CSS properties, or playing with the offset property.

Offset documentation from Tippy https://atomiks.github.io/tippyjs/v6/all-props/#offset

Offset documentation from Popper https://popper.js.org/docs/v2/modifiers/offset/#offset-1

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!