Bug report
Current Behavior
I cannot use alignOffset to shift the content down (when align="end"), it seems that it is limit to the boundary of the trigger.
No matter what value I set for alignOffset, the content will stay at the same position.
To reproduce, try to change the alignOffset from 0 to -100, and to -1000, it won't go down anymore when it reaches the bottom edge of trigger.
No idea how to solve this, and would be very grateful for any help!
I want to dynamically display the hover card content in different vertical positions, but it remains in the same position as in the example when I tried to set the alignOffset even smaller (negative value to let it goes down).
Expected behavior
I expect I can use alignOffset to shift the content down as I set it.
Reproducible example
https://codesandbox.io/p/sandbox/radix-hovercardcontent-alignoffset-issue-342tpf?file=%2Fsrc%2FApp.jsx
Your environment
| Software |
Name(s) |
Version |
| Radix Package(s) |
@radix-ui/react-hover-card |
^1.1.2 |
| React |
n/a |
18.3.1 |
| Browser |
Chrome |
Version 131.0.6778.86 (Official Build) (64-bit) |
| Assistive tech |
|
|
| Node |
n/a |
|
| npm/yarn |
|
|
| Operating System |
Win 10 Pro |
22H2 |
Bug report
Current Behavior
I cannot use
alignOffsetto shift the content down (whenalign="end"), it seems that it is limit to the boundary of the trigger.No matter what value I set for
alignOffset, the content will stay at the same position.To reproduce, try to change the
alignOffsetfrom0to-100, and to-1000, it won't go down anymore when it reaches the bottom edge of trigger.No idea how to solve this, and would be very grateful for any help!
I want to dynamically display the hover card content in different vertical positions, but it remains in the same position as in the example when I tried to set the
alignOffseteven smaller (negative value to let it goes down).Expected behavior
I expect I can use
alignOffsetto shift the content down as I set it.Reproducible example
https://codesandbox.io/p/sandbox/radix-hovercardcontent-alignoffset-issue-342tpf?file=%2Fsrc%2FApp.jsx
Your environment