How to add scroll into react-bootstrap Modal.Body
Thanks to Amit answer.
The first solution using only styles would be the following:
<Modal.Dialog> <Modal.Header> <Modal.Title>Modal title</Modal.Title> </Modal.Header> <Modal.Body style={{ maxHeight: 'calc(100vh - 210px)', overflowY: 'auto' }} > One fine body... </Modal.Body> <Modal.Footer> <Button>Close</Button> <Button bsStyle="primary">Save changes</Button> </Modal.Footer> </Modal.Dialog>
There is a new way to implement that behavior using the react-bootstrap
itself:
<Modal scrollable={true} ....> ....</Modal>
Documentation: https://react-bootstrap.netlify.app/components/modal/#modals
you can add scrallable to Modal tag like this
<Modal scrollable={true} ></Modal>
you can get in detail here: https://react-bootstrap.netlify.app/components/modal/#modals