So in spite of the bug fix Konrad mentioned two months ago, it looks like this is still occurring as I installed the latest version using NPM today for the first time.

Per Anna's question for clintse, the code I'm using is exactly what's in the MDB documentation, verbatim except for a couple of name changes because I was plugging it into an existing app.

The result was a functional modal (to MDB's credit since every other modal node module was giving me endless grief, including reactstrap) but without the ability to scroll the page. There's definitely still something like overflow: hidden in the CSS affecting body whether or not the modal is active.

After fooling around a bit and trying purtzerb's suggestion (which wouldn't affect body anyway), I tried the most brick-to-the-face obvious thing I could think of, and it worked.

In your custom CSS (assuming you have a custom style sheet – you can import a custom style sheet using something like import './assets/css/custom.css' just like you did to import mdbreact) just add:

body {
overflow-y: scroll !important;
}

Works like a charm. I was afraid it might stop the modal from scrolling when the modal is active, but it doesn't. The modal scrolls when it is active, the body scrolls when the modal is inactive.

If your body length is too short to scroll on larger screens but long enough to scroll on smaller screens, you could probably use auto instead of scroll.

Is this bug fixed in the current release? Didn't find it in release history and I have the same issue.

I am still seeing this issue. The modal-open class is not removed from the body tag after closing the modal. I am using React version

Your modal examples do not prevent scrolling as is the desired behavior. You probably just have modal-open: {overflow-y: scroll} defined in your app.css. This is a workaround that deviates from desired behavior. Your class of modal-open is still on your body tag. It just serves no purpose currently.

I was irritated yesterday, so I apologize again for my sarcastic comment lol I realize you guys have alot on your plate.

Hi there,

regarding the scrolling problem - thank you @purtzerb for pointing out that the .modal-open class is not removed after closing the modal - I've already added it to our TODO list - but it is not a cause of the problem. Please check out our demo as a reference https://react.mdbootstrap.com/modals/modal - the scroll works fine there.

@clintse please share with us your code

Since the staff here are unable to ever get to questions, I will help you. Mind you that I downloaded this 3 days ago and seem to know more than the staff. Their modal logic is crap. They add a class named 'modal-open' or 'open-modal', I cant remember which, to the body when the modal mounts. This is "meant" to prevent scrolling when the modal is open. But they have not figured out how to use react well enough to know that this will prevent scrolling all the time. They SHOULD have added it to the body when the modal opens.

SOLUTION: figure out what class they add to the body. Add this in the css: .modal-open { overflow-y: scroll }

This will allow you to scroll again. I am going to add my own logic to the modal to prevent scrolling when the modal opens like how it should have been originally.

They also have other errors. The tooltip doesn't work at all. I am sure I will find more.

Good luck dealing with these people...