Set bootstrap modal body height by percentage
I am trying to make a modal with a body that will scroll when the content becomes too large. However, I want the modal to be responsive to the screen size. When I set the max-height to 40% it has no effect. However, if I set the max-height to 400px it works as expected, but is not responsive. I am sure I am just missing something simple, but I can't seem to get it to work. Here is an example Doesn't work: .modal-body { max-height:40%; overflow-y: auto; } Works: .modal-body { max-height:400px; overflow-y: auto; } This worked for me .modal-dialog, .modal-content { /* 80% of window height */