[Bug]: Select dropdown is broken on mobile resolution

[shafaqkazmi]

Component

Select

Package version

9.55.1

React version

18.2.0

Environment

System:
    OS: macOS 15.2
    CPU: (11) arm64 Apple M3 Pro
    Memory: 169.09 MB / 36.00 GB
    Shell: 5.9 - /bin/zsh
  Browsers:
    Chrome: 131.0.6778.205
    Safari: 18.2
  npmPackages:
    @fluentui/react-components: ^9.55.1 => 9.55.1 
    @fluentui/react-nav-preview: ^0.10.6 => 0.10.6 
    @types/react: ^18.0.25 => 18.0.25 
    @types/react-dom: 18.0.9 => 18.0.9 
    react: 18.2.0 => 18.2.0 
    react-dom: 18.2.0 => 18.2.0

Current Behavior

Select component works correctly in the desktop view, but in smaller resolutions, the dropdown appears misaligned or incorrectly positioned when opened (see attached image)

Expected Behavior

Select dropdown should aligned to the input element on all resolution

Reproduction

https://react.fluentui.dev/?path=/docs/components-select--docs

Steps to reproduce

It can also be reproduced on the library

• Go to https://react.fluentui.dev/?path=/docs/components-select--docs
• Change browser resolution to Mobile (from developers console)
• Click on Select dropdown icon

Current behvior:

• Dropdown is mis aligned and

Expected behavior:

• Dropdown should aligned to the input field

Are you reporting an Accessibility issue?

None

Suggested severity

Urgent - No workaround and Products/sites are affected

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[fouedd9]

Dropdown scroll issue on iOS devices in portrait mode

Description:

There is an issue with the Dropdown component in Fluent UI Northstar when used on iOS devices. The list of items is not scrollable in portrait mode. However, it works correctly on Android devices, desktop browsers, and even on iOS devices when switched to landscape mode.

This behavior is inconsistent and seems to be specific to iOS in portrait orientation.

Steps to reproduce:

Use the Dropdown component in a Fluent UI Northstar project.
Open the application on an iOS device (e.g., iPhone) in portrait mode.
Try to scroll through a long list of items in the dropdown.
Expected behavior:
The list of items in the dropdown should be scrollable in both portrait and landscape modes on iOS, as it is on Android and desktop browsers.

Actual behavior:
The list is not scrollable in portrait mode on iOS devices. Scrolling works only when the device is switched to landscape mode.

Environment details:

Fluent UI Northstar version: 0.63.0
iOS version: