Select component dropdown positioning breaks when placed in Navbar

Prerequisites

• I am using the correct version of React-Bootstrap for my version of Bootstrap
• I have searched for duplicate or closed issues
• I have read the contributing guidelines

Describe the bug

Hello I’m currently building a custom Navbar using React-Bootstrap and have a requirement to include a Select component inside the Navbar.

However, when the Select component is added, its dropdown-menu does not appear in the correct position. Instead, when inspecting the element, the dropdown is rendered at the bottom of the screen rather than aligned with the Select trigger inside the Navbar.

At the moment, the only workaround is to manually override the positioning using custom CSS, which is not an ideal or maintainable solution.

Could you please look into this issue? Any guidance or a fix would be greatly appreciated. Thank you!

Expected behavior

The dropdown menu should be positioned correctly relative to the Select component when used inside a Navbar, without requiring manual CSS adjustments.

To Reproduce

No response

Reproducible Example

https://codesandbox.io/p/sandbox/empty-surf-566wp4

Screenshots

No response

What operating system(s) are you seeing the problem on?

Linux

What browser(s) are you seeing the problem on?

Chrome

What version of React-Bootstrap are you using?

2.10.10

What version of Bootstrap are you using?

5.3.8

Additional context

No response