Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Popover breaks the body tag #19961

Closed
2 tasks done
rodolfoberlezi opened this issue Mar 3, 2020 · 3 comments
Closed
2 tasks done

Popover breaks the body tag #19961

rodolfoberlezi opened this issue Mar 3, 2020 · 3 comments
Labels
component: Popover The React component. support: question Community support but can be turned into an improvement

Comments

@rodolfoberlezi
Copy link

rodolfoberlezi commented Mar 3, 2020 •
edited
Loading

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

When I click to open the popover text box, the body receives a style to modify its padding-right and overflow. I noticed it in my web application because it has a different background color and shakes when the pop is up, then I got that the problem is in the component.
Also I noticed it creates a div with a layer, expecting to receive a click to disappear. I supose this is the problem.

Before click
case1

After click
case2

Expected Behavior 🤔

It should not break the page when it pops up.

Steps to Reproduce 🕹

Steps:

  1. Click the popover button
  2. Click again anywhere in the page to return

Your Environment 🌎

Tech Version
Material-UI v4.5.1
React 16.10.2
Browser Google Chrome
@oliviertassinari
Copy link
Member

This is expected, use the Popper component is you are not looking for the modal behavior.

@oliviertassinari oliviertassinari added component: Popover The React component. support: question Community support but can be turned into an improvement labels Mar 3, 2020
@mnajdova mnajdova mentioned this issue Sep 1, 2021
Closed
2 tasks
@divs94
Copy link

divs94 commented Jun 21, 2022

Hello hope you doing well. i am also having the same issue with popover getting 'padding-right:17px' to body after clicking on . Is there any resolution you've got??

@moinulmoin
Copy link

Hello hope you doing well. i am also having the same issue with popover getting 'padding-right:17px' to body after clicking on . Is there any resolution you've got??

use disableScrollLock props whenever it happens any kind of mui component. Reference

@loizosv loizosv mentioned this issue May 21, 2024
Open
CannonLock added a commit to CannonLock/pelican that referenced this issue Jun 4, 2024
@CannonLock
Set padding to 0 on the body
a2534ab 
Apparently the expected behavior for a Popover is to add padding to the body for no reason I can ascertain.

To prevent this from effecting us I will hardcode the padding to 0. This does not effect the popovers use.

mui/material-ui#19961
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
component: Popover The React component. support: question Community support but can be turned into an improvement
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@oliviertassinari @rodolfoberlezi @moinulmoin @divs94