I have set opacity to 1 but I can still see though about react-tooltip

[ishandutta2007]

Thanks @gabrieljablonski for your quick reply

Actually I managed to debug it myself before I got to see your reply.
For me z-index was the issue:
This solved it:

  <Tooltip id="my-tooltip-opacity" opacity={1.0}  style={{ zIndex: "1000" }} />

[gabrieljablonski]

Please try a couple things to help narrow it down:

• Does it happen on other browsers? (Firefox, Chrome, Safari, ...)
• Are you able to reproduce it on a fresh project? There might be some extra CSS on your application that's messing with the tooltip. (You can try setting one up really quick on StackBlitz)

If it doesn't happen on a fresh project, we'd need to check out your actual application to give some insight on what might be happening. If it's a private project that you can't share, your best bet would be to try and inspect element on the tooltip and dig through the CSS classes applied during runtime, you might find something there.

Let us know what you find!

[gabrieljablonski]

One last thing you could try is overriding the opacity CSS variable directly:

:root {
  --rt-opacity: 1.0;
}

Probably won't work given your observations, but worth a try.