How do I print the entire bootstrap modal where content in modal body is scrolled out of view

Was facing the same issue with angularjs UI bootstrap library. Tried the link provided above but no luck. The only CSS that works for me when the modal is LONGER than the view port is:

@media print {
    .modal {
        position: absolute;
        left: 0;
        top: 0;
        margin: 0;
        padding: 0;
        overflow: visible!important;
    }
}

Note: position:absolute and overflow:visible are MUST have. Hope this could also solve your problem when printing angularUI-Bootstrap-Modal.

Download printThis.js from the following link and include it in your html: https://github.com/jasonday/printThis/blob/0a7f799693af8a8303bf0b8df0efc80c2694af81/printThis.js

Wrap the content you want to print with the following div. Everything outside of this div will not be printed.

<div id="modalDiv">
    ..content to print..
</div>

Call the following jquery to print all the content including the content that is not viewable. You may include your css files in an array if you have multiple css files.

$("#modalDiv").printThis({ 
    debug: false,              
    importCSS: true,             
    importStyle: true,         
    printContainer: true,       
    loadCSS: "../css/style.css", 
    pageTitle: "My Modal",             
    removeInline: false,        
    printDelay: 333,            
    header: null,             
    formValues: true          
}); 

I think you can easily do that with CSS using @media print:

If there is opened bootstrap modal window, will be printed content of modal (it can be more than one page), in other case content of window.

@media print {
    /* on modal open bootstrap adds class "modal-open" to body, so you can handle that case and hide body */
    body.modal-open {
        visibility: hidden;
    }

    body.modal-open .modal .modal-header,
    body.modal-open .modal .modal-body {
        visibility: visible; /* make visible modal body and header */
    }
}

Also you can add button on footer of modal for printing:

<div class="modal-footer">
    <button type="button" class="btn btn-default" onclick="js:window.print()">print modal content</button>
</div>