Provide a general summary of the issue here
When the container width is fractional (e.g. 250.5), the Virtualizer rounds the width up, which causes a horizontal scrollbar to appear. This is similar to the Table issue #9448, but it also occurs with ListLayout (and likely all remaining layouts as well).
🤔 Expected Behavior?
The width should be rounded down, so no horizontal scrollbar appears.
😯 Current Behavior
The width may be rounded up by as much as one pixel, causing a horizontal scrollbar.
💁 Possible Solution
No response
🔦 Context
For example, in a responsive layout with two lists each taking 50% of the page width, where both use a Virtualizer.
🖥️ Steps to Reproduce
https://stackblitz.com/edit/yyx9dlnx?file=src%2FExample.tsx
Version
react-aria-components@1.20.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
macOS
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response
Provide a general summary of the issue here
When the container width is fractional (e.g. 250.5), the Virtualizer rounds the width up, which causes a horizontal scrollbar to appear. This is similar to the Table issue #9448, but it also occurs with ListLayout (and likely all remaining layouts as well).
🤔 Expected Behavior?
The width should be rounded down, so no horizontal scrollbar appears.
😯 Current Behavior
The width may be rounded up by as much as one pixel, causing a horizontal scrollbar.
💁 Possible Solution
No response
🔦 Context
For example, in a responsive layout with two lists each taking 50% of the page width, where both use a Virtualizer.
🖥️ Steps to Reproduce
https://stackblitz.com/edit/yyx9dlnx?file=src%2FExample.tsx
Version
react-aria-components@1.20.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
macOS
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response