Modal window scrolling

I have the modal window (bootstrap 3):

<div class="modal fade" id="modal1">            
<div class="modal-dialog">                    
    <div class="modal-content">
        <div class="modal-header">
            TITLE
        </div>
        <div class="modal-body">
            TEXT
            </div>
        </div>
        <div class="modal-footer">
            <form><input class="btn btn-success" type="button" value="NEXT" data-toggle="modal" data-dismiss="modal" data-target="#modal2"/></form>
        </div>
    </div>
</div>

By clicking on “NEXT” button, #modal1 is closing and #modal2 is opening:

<div class="modal fade" id="modal2">            
<div class="modal-dialog">                    
    <div class="modal-content">
        <div class="modal-header">
            TITLE
        </div>
        <div class="modal-body">
            TEXT //lots of text there
            </div>
        </div>
        <div class="modal-footer">
            <form><input class="btn btn-danger" type="button" value="EXIT" data-dismiss="modal"/></form>
        </div>
    </div>
</div>

Scrolling is working fine in the first modal window #modal1, but in the #modal2 it is not working, there is not even the scrollbar.
So, the question is: How to make the scrolling work in the second window?


Source: css

Leave a Reply