HTML печатает только верхний и нижний колонтитулы на первой странице, когда тело длинное: использование таблицы и текста для макета - PullRequest
Новая
       43

HTML печатает только верхний и нижний колонтитулы на первой странице, когда тело длинное: использование таблицы и текста для макета

0 голосов
/ 10 апреля 2019

Я пытаюсь распечатать страницу HTML, стилизованную с использованием таблиц, thead, tbody, tfoot.Этот макет был выбран, так как нам нужны верхний и нижний колонтитулы при каждом выводе печатной страницы.Содержание тела динамично.

Проблема в том, что когда содержимое tbody умещается на одном А4, вывод на печать чистый и идет на одной странице, как и ожидалось, с верхним колонтитулом, за которым следуют нижний и нижний колонтитулы.Если содержимое тела длинное, вывод на печать дает только верхний и нижний колонтитулы на первой странице.Выходные данные со второй страницы и далее ожидаются: верхний колонтитул + содержание тела + нижний колонтитул.

Я пытался использовать сочетания @media print со значениями разрыва страницы до, разрыва страницы, внутреннего разрыва страницы, установленными на автоматический / недопустимый.Но не повезло.

Я правильно получаю верхний и нижний колонтитулы на каждой странице.Итак, как исправить эту первую страницу (пустое тело), ​​когда тело длинное и охватывает несколько страниц? 

<body>
    <div>
        <table>
            <thead>
                <tr>
                    <th><header >
                            <div class="row">
                                <div class="col-md-2"></div>
                                <div class="col-md-2">
                                </div>
                                <div class="col-md-4 ">
                                </div>
                                <div class="col-md-2">
                                </div>
                                <div class="col-md-2">
                                </div>
                            </div>
                            <hr>
                        </header></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        <div> some dynamic content will come here </div>
                    </td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td><footer class="printFooter">
                        </footer></td>
                    </tr>
            </tfoot>
        </table>
    </div>
    <script type="text/javascript">
        $(document).ready(function() {
            printHeaderForPrint();
        });
    </script>
    <script type="text/javascript" src="js/somejavascript.js"></script>
</body>
...