CTRL + P печатает не более 1 страницы

Question

У меня есть HTML-страница, на которой несколько изображений динамически создаются с использованием JPGraph следующим образом:

 <div class="demo-drawer mdl-layout__drawer mdl-color--blue-grey-900 mdl-color-text--blue-grey-50">
        <nav class="demo-navigation mdl-navigation mdl-color--blue-grey-800">
            <form  id ="target">
                Start Date:
                    <input type ="date" name ="startDate" value="2012-01-04"/>
                 <p> </p>
                 End Date: &nbsp
                    <input type ="date" name ="endDate" value= <?php echo date('Y-m-d'); ?> >
                <br>
                <br>
                Report Type
                <br>
                    &nbsp<input type="checkbox" name = "session" value="session"> Longest Sessions
                <br>
                    &nbsp<input type="checkbox" name = "export" value="export"> Export Data
                <br>
                    &nbsp<input type="checkbox" name = "format" value="format"> Format Data
                <br>
                    &nbsp<input type="checkbox" name = "scan" value="scan"> Scan Data
                <br>
                <br>
                 <input type="submit" name="submit" value="Search"/>
                <input type="button" value = "Print" onclick="window.print();return false;"/>
            </form>
<script>
                $(document).ready(function (e) {
                    $("#target").submit(function (e) {
                        e.preventDefault();
                        var form_data = new FormData(this);
                        $.ajax({
                            url: "DrawGraphs.php", // Url to which the request is send
                            type: "post",             // Type of request to be send, called as method
                            data: form_data, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
                            contentType: false,       // The content type used when sending data to the server.
                            cache: false,             // To unable request pages to be cached
                            processData: false,        // To send DOMDocument or non processed data file it is set to false
                            dataType: "json",
                            success: function (data)   // A function to be called if request succeeds
                            {
                                document.getElementById("graphs").innerHTML = "";
                                console.log( 'ready!' );
                                //var myImages = '';
                                for(var image in data) {
                                    $("#graphs").append('<img src="data:image/png;base64,' + data[image]+ '"/>'+);
                                     //myImages += '<img src="data:image/png;base64,' + data[image]+ '"/>';

                                };
                                //$("#graphs").html(myImages);
                            },error:function(XMLHttpRequest, textStatus, errorThrown){
                                console.log(XMLHttpRequest);
                                console.log(errorThrown );
                            }
                        });
                    });
                });

            </script>

<main class="mdl-layout__content mdl-color--grey-100">
    <div class = "mdl-js-layout">
        <div id = "graphs" class="mdl-grid demo-content">
         <p>Select the types of report and the date range to search.</p>
        </div>
    </div>
</main>
</div>

Проблема возникает, когда я пытаюсь распечатать страницу либо с помощью JavaScript-функции window.print и CTRL.+ P. Кажется, что он не распечатывает более одной страницы, и он будет печатать только текущий кадр, на котором находится полоса прокрутки до конца этой страницы.Я обнаружил, что мне может понадобиться добавить @media print в мой файл css, но, похоже, это никак не повлияет на печать.Я добавил следующее в файл css:

@media print {
    body{
        width: 100%;
        margin: 0;
        padding: 0;
    }

    img {
        max-width: 100%;
    }
    img {
        page-break-inside: avoid;
    }
}

Я не очень понимаю, как определить, как и что печатать в css, так что если кто-то может указать мне правильное направление, это будет оченьоценили.Заранее спасибо.