Ломается таблица wkhtmltopdf

Подскажите как бороться с проблемой разрыва страницы c wkhtmltopdf и pdfkit, если задать tr { display: inline-table; } , таблица не разрывается но колонки таблицы смещаются и можно ли повторить хедер на каждой новой странице?

def create_pdf(data):
now = datetime.datetime.now()
html = '''
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
        <html>
            <head>
            <META http-equiv="Content-Type" content="text/html; charset=utf-8">
            <meta name="pdfkit-orientation" content="Landscape"/>
             <link href="{{css}}" rel="stylesheet"> 
        <style>
            body{margin:0}
            #m_customers{font-family:Arial,Helvetica,sans-serif;border-collapse:collapse;}
            #m_customers td,#m_customers th{border:1px solid grey;padding:8px}
            #m_customers td{vertical-align:top}
            #m_customers tr:nth-child(even){background-color: #f2f2f2;}
            #m_customers th{padding-top:12px;padding-bottom:12px;text-align:left;background-color:
            #b2d2e3ff;color:white}
        </style>
            </head>
        <body>

        <div style="display:flex;justify-content: space-between;background:#2a122aff;color:rgba(255,255,255,0.89);padding:0 50px">
           <div style="display:flex">
                <div style="padding-right:30px;align-self:center;">
                    <img src="{{logo}}" alt="logo" width="250" >
                </div>
                <div style="line-height:8px; align-self:flex-end; padding-bottom: 10px;">
                    <p>Project: {{name}} </p>
                    <p>Report: CD Drawing LOD Review</p>
                </div>
            </div>
            <div style="display:flex">
                <div style="line-height:5px;padding-right:30px;font-size:13px">
                    <p style="font-size:16px">LEGEND</p>
                    <p>WHITE = N/A</p>
                    <p>RED = High</p>
                    <p>YELLOW = Medium</p>
                    <p>GREEN = Low</p>
                </div>
                <div>
                    <p style="padding-top:10px">{{date.day}} {{month}} {{date.year}}</p>
                </div>
            </div>
        </div>
        
        <table id="m_customers">
        
        <thead>
            <tr>
                <th>Issue ID#</th>
                <th>Sheet</th>
                <th>Uniformat</th>
                <th>Title</th>
                <th>Description</th>
                <th>Image</th>
                <th>Priority</th>
                <th>Hyperlink</th>
            </tr>
        </thead>
        
        <tr style="page-break-before: always">
                   {% for issue in list_issue %}
            <td style="text-align:center">{{issue.number}}</td>
            <td style="text-align:center">
                {% if issue.sheet_numbers %}
                    {% for is in issue.sheet_numbers %}
                        {{is}}
                    {%endfor%}
                {%else%}
                -
                {%endif%}
            </td>
            <td style="text-align:center">{{issue.uniformat.code}}</td>
            <td>{{issue.title}}</td>
            <td>{{issue.description}}</td>
            <td>
                {% if issue.image %}
                <img src="{{issue.image}}" style="width:300px;height:325px;">
                {%endif%}    
            </td>
                
                {% if issue.priority == 'medium' %}
                    <td style="text-align:center;background-color:yellow">{{issue.priority}}</td>
                {%elif issue.priority == 'low'%}
                        <td style="text-align:center;background-color:green">{{issue.priority}}</td>
                {%elif issue.priority == 'high'%}
                            <td style="text-align:center;background-color:red">{{issue.priority}}</td>
                {%elif issue.priority == ''%}
                        <td style="text-align:center;background-color:white">{{issue.priority}}</td>
                {% endif %}
            <td>{{issue.link}}</td>
        </tr>       
                    {% endfor %}
        </table>
        </body>
        </html>
'''

tm = Template(html)
logo = get_logo()+'/logo.png'
css = get_css()
msg = tm.render(name=data.get('project_name'), list_issue=data.get('issues'), logo=logo,
                                     date=now, month=mon_name(now.month), css=css)

options = {
    'quiet': '',
    'orientation': 'Landscape',
    'encoding': "UTF-8",
    'no-outline': None,
    'page-size': 'A4'
    }

name = f'issues_list_{str(uuid.uuid4())}.pdf'
pdfkit.from_string(msg, f'reports/{name}', options=options)
return name

выввод


Ответы (1 шт):

Автор решения: Kirill

Кому интересно решил проблему с помощью tr { display: inline-table; } и выставлением ширины каждого столбца вручную.

→ Ссылка