On Android/Chrome, opening Dialog results in too much right-padding if the page has horizontal overflow #3396
Comments
This was referenced Sep 1, 2024
|
Confirmed that this is an issue (see the video in this post for a project I tried using v2.1.3 of the @headlessui/react library in: Sendouc/sendou.ink#1857 (comment)) |
|
I have this behavior as well on my application: |
|
I have this too, v2.2.0, annoying! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What package within Headless UI are you using?
@headlessui/react
What version of that package are you using?
v.2.1.2
What browser are you using?
Chrome
Reproduction URL
fork of your React CodeSandbox starter
Describe your issue
In Chrome on Android (or on macOS with Responsive mode enabled), if there's x-overflow on the page, then opening a Dialog results in too much
padding-rightgetting added to the<html>element. This can be seen in the CodeSandbox link I provided above: if you go there in Chrome on macOS, view the Preview window in a separate tab, and then enable Responsive mode from the Chrome dev-tools, then you should encounter the behavior seen in the video below when you open the Dialog (which is what I'm encountering in Android on a project I'm working on).Screen.Recording.2024-07-22.at.12.42.43.PM.mov
The text was updated successfully, but these errors were encountered: