question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

modal adding unwanted padding-right on body

See original GitHub issue

Thanks for otherwise awesome work!

Current behavior

Modal is adding a padding-right: 15px style on body tag. I understand this is to compensate for possible scrollbars, but in our case it messes with our design. Our body elements are meant to stretch all the way to the right edge, and the body padding makes it look broken.

Happens here:

  if (document.body.scrollHeight > window.innerHeight) {
    // add padding so the content doesn't shift after removal of scrollbar
    states.previousBodyPadding = parseInt(window.getComputedStyle(document.body).getPropertyValue('padding-right'));
    document.body.style.paddingRight = states.previousBodyPadding + measureScrollbar() + 'px';
  }

Expected behavior

Don’t change padding of html body.

(Alternatively, allow me to turn this feature off through config)

Demo

https://tin-bar.glitch.me/

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:11 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
gvernicommented, Feb 14, 2019

@limonte @tomholub sounds good to me. I’ll start implementing it…

1reaction
tomholubcommented, Feb 19, 2019

Noted, will do!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Bootstrap Modals keep adding padding-right to body after ...
The problem is caused by a function in the bootstrap jQuery that adds a bit of padding-right when a modal window opens if...
Read more >
Unnecessary padding-right added to modal · Issue #17622
Hello, When a modal is open, a padding-right is added even when it's not needed (Bootstrap 3.3.5 in latest firefox and latest chrome)....
Read more >
Remove the padding right modal on navigation
Hello, today I install the modal button in my navigation. When I click on the icon I see a style who appared on...
Read more >
Modal – Carbon Design System
If the modal is smaller than 36% then it has a fixed margin-right: 16px/1rem . Body copy, including titles, in a modal always...
Read more >
padding - CSS: Cascading Style Sheets - MDN Web Docs
An element's padding area is the space between its content and its border. Note: Padding creates extra space within an element. In contrast, ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found