cloudflare / cloudflare/react-modal2

Handle scrollbar compensation

Open
#16 2 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
275
Forks
16
PR merge metrics
No merged PRs in 30d

Description

Usually, you would set `overflow: hidden` to body when the modal mounts. However, this causes a weird adjustment to the layout (because the scrollbar disappears). This mostly affects Windows/Linux users, and some OSX users that use a mouse (because it forces the scrollbar to appear).

As an example, compare [Semantic UI's Modal](http://semantic-ui.com/modules/modal.html) and [TWBS' Modal](http://getbootstrap.com/javascript/#modals). TWBS solved this by adding a `padding-right` to the `body` when the modal mounts.

\* I'm not sure whether this would make this project more opinionated. Moreover, I'm torn whether this belongs to the core functionality or to userland code.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.