Skip to content
This repository was archived by the owner on May 29, 2019. It is now read-only.

Open modal is shifting body content to the right #3714

Closed
alexndlm opened this issue May 26, 2015 · 7 comments
Closed

Open modal is shifting body content to the right #3714

alexndlm opened this issue May 26, 2015 · 7 comments
Labels
component: modal needs: investigation type: enhancement
Milestone
Backlog

Comments

@alexndlm
Copy link

When the page has a vertical scroll and opens a modal window, the vertical scroll on the page hiding. Because of this, the content moves to the right. In the Bootstrap this problem is solved by adding right padding to the body when scroll hiding.

http://plnkr.co/edit/ynWJUbnryVkSHdEjFRMw?p=preview
@rvanbaalen
Copy link
Contributor

Not sure if this is something UI Bootstrap should do since it's part of the styling.
You can however easily implement this behaviour in CSS by styling the body.modal-open selector

@rvanbaalen rvanbaalen added this to the Backlog milestone May 27, 2015
@alexndlm
Copy link
Author

More info for Bootstrap twbs/bootstrap#9855

@rvanbaalen
Copy link
Contributor

This is my first thought as well:

twbs/bootstrap#9855 (comment)

@rvanbaalen
Copy link
Contributor

Referencing this here, could be a solid fix:

twbs/bootstrap@0907244

@kunal999
Copy link

+1

@icfantv
Copy link
Contributor

icfantv commented Sep 16, 2015

Please do not just "+1" issues. If you would like to show your support for a fix, PRs are welcome. Simply adding the text "+1" adds no inherent value and clutters up the thread. Thanks.

kunal999 added a commit to kunal999/bootstrap that referenced this issue Oct 29, 2015
@kunal999
fix(modal): prevent body content shifting when vertical scrollbar
46bbcbe 
- If body has vertical scrollbar and appendTo element is 'body', add right padding to body equivalent to scrollbar width. Also, conditionally add right or left padding to modal window

Closes angular-ui#3714
@kunal999 kunal999 mentioned this issue Oct 29, 2015
Closed
kunal999 added a commit to kunal999/bootstrap that referenced this issue Oct 30, 2015
@kunal999
fix(modal): remove unnecessary .eq(0) from $document.find('body')
93d4133 
Closes angular-ui#3714
kunal999 added a commit to kunal999/bootstrap that referenced this issue Oct 30, 2015
@kunal999
fix(modal): clean up paddings for modal window
b642c01 
Set modal window padding after modal is rendered.
Remove unnecessary null checks.
Set modal padding properties only when required.

Closes angular-ui#3714
kunal999 added a commit to kunal999/bootstrap that referenced this issue Oct 30, 2015
@kunal999
fix(modal): prevent body content shifting when vertical scrollbar
d8daf3a 
- If body has vertical scrollbar and appendTo element is 'body', add right padding to body equivalent to scrollbar width. Also, conditionally add right or left padding to modal window

Closes angular-ui#3714
kunal999 added a commit to kunal999/bootstrap that referenced this issue Oct 30, 2015
@kunal999
fix(modal): remove unnecessary .eq(0) from $document.find('body')
4c13747 
Closes angular-ui#3714
kunal999 added a commit to kunal999/bootstrap that referenced this issue Oct 30, 2015
@kunal999
fix(modal): clean up paddings for modal window
b9e89e4 
Set modal window padding after modal is rendered.
Remove unnecessary null checks.
Set modal padding properties only when required.

Closes angular-ui#3714
@wesleycho wesleycho mentioned this issue Nov 4, 2015
Closed
@wesleycho
Copy link
Contributor

Closing as a duplicate of #2631

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
component: modal needs: investigation type: enhancement
Projects
None yet
Milestone
Backlog
Development

No branches or pull requests
5 participants
@rvanbaalen @icfantv @wesleycho @kunal999 @alexndlm