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 overflow
See original GitHub issueModal overflow
Seems that Modal component has an overflow which trims overflowing components inside (eg. dropdown, tooltip)
What package(s) are you using?
-
carbon-components -
carbon-components-react
Steps to reproduce the issue
- Create a modal
- Place an overflowing component (eg. dropdown) inside
Additional information
opened (trimmed) dropbox inside the modal:
expected result:
Issue Analytics
- State:
- Created 3 years ago
- Reactions:3
- Comments:7 (3 by maintainers)
Top Results From Across the Web
How to put scroll bar only for modal-body? - Stack Overflow
Bootstrap 4.3 added new built-in scroll feature to modals. This makes only the modal-body content scroll if the size of the content would...
Read more >Modal - Bootstrap
Modals are built with HTML, CSS, and JavaScript. · Clicking on the modal “backdrop” will automatically close the modal. · Bootstrap only supports...
Read more >Modal - overflow-y-scroll - Material Design for Bootstrap
Actual behavior When opening a modal, overflow-y-scroll is added to the body classes. This causes a scrollbar to appear on pages that do...
Read more >How to create a custom resizable modal with scrollable and ...
Modal windows (aka modals) are everywhere in websites and web applications. ... Overflow-y property applied to the modal.
Read more >Prevent Page Scrolling When a Modal is Open | CSS-Tricks
Unfortunately overscroll-behavior: contain does not prevent the scrolling when the content is less or equal to the parent(as in, no overflow).
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@yrue in the meantime you can manually overwrite these overflows. Check #6289 or #6290
@mateBe95 I’m not on the Carbon team, so I don’t know. There are numerous outstanding issues related to this, but no prognosis or timeline yet. See:
https://github.com/carbon-design-system/carbon/issues/7565#issuecomment-786921600