Tooltip position is not updated when resizing window about floating-ui HOT 2 CLOSED

By default, floating elements don't remain anchored when scrolling and resizing because we don't know if you're conditionally rendering them or hiding them with CSS.

This is documented here: https://floating-ui.com/docs/react#anchoring

Add whileElementsMounted: autoUpdate to your options if conditionally rendering it.

but I need those offsets because it looks wrong otherwise

You shouldn't need to do this. It's likely your anchor/reference element has some "invisible" padding that prevents it from being correctly centered visually but affects its layout still. If you make the anchor element correctly sized, you shouldn't need to add manual offsets which come with a variety of problems in certain situations.

from floating-ui.

By default, floating elements don't remain anchored when scrolling and resizing because we don't know if you're conditionally rendering them or hiding them with CSS.

This is documented here: floating-ui.com/docs/react#anchoring

Add whileElementsMounted: autoUpdate to your options if conditionally rendering it.

but I need those offsets because it looks wrong otherwise

You shouldn't need to do this. It's likely your anchor/reference element has some "invisible" padding that prevents it from being correctly centered visually but affects its layout still. If you make the anchor element correctly sized, you shouldn't need to add manual offsets which come with a variety of problems in certain situations.

Interesting, If I add whileElementsMounted: autoUpdate it does indeed work better and I can drop my top offset to 0, I still have to do the spread of the floatingStyles default though.

from floating-ui.