<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <style type="text/css">
            body {
                font-family:'Lucida Console', monospace;
            }
            .border {
                border: 1px solid black;
            }
            .table {
                border-collapse: collapse;
                width: 100%;
                page-break-inside: avoid;
            }
        </style>
    </head>
    <body>
        {% for batchedQrImages in qrImages|batch(16) %}
            <table class="table">
            {% for row in batchedQrImages|batch(2) %}
                <tr class="tr-avoid-break">
                    {% for qr in row %}
                    <td class="border">
                        <table>
                            {% set qrLinkParts = qr.link|split('', qr.link|length//2) %}
                            <tr><td>{{qr.svg|raw}}</td><td>{{qrLinkParts[0]|split('', 4)|join(' ')}}<BR />{{qrLinkParts[1]|split('', 4)|join(' ')}}</td></tr>
                        </table>
                    </td>
                    {% endfor %}
                </tr>
            {% endfor %}
            </table>
        {% endfor %}
    </body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <style type="text/css">
            .border {
                border: 1px solid black;
            }
            .table {
                border-collapse: collapse;
                width: 100%;
                page-break-inside: avoid;
            }
        </style>
    </head>
    <body>
        {% for batchedQrImages in qrImages|batch(16) %}
            <table class="table">
            {% for row in batchedQrImages|batch(2) %}
                <tr class="tr-avoid-break">
                    {% for qr in row %}
                    <td class="border">
                        <table>
                            {% set qrLinkParts = qr.link|split('', qr.link|length//2) %}
                            <tr><td>{{qr.svg|raw}}</td><td><pre>{{qrLinkParts[0]|split('', 4)|join(' ')}}<BR />{{qrLinkParts[1]|split('', 4)|join(' ')}}</pre></td></tr>
                        </table>
                    </td>
                    {% endfor %}
                </tr>
            {% endfor %}
            </table>
        {% endfor %}
    </body>
</html>
Replace css monospace with <pre> tag
Replace css monospace with <pre> tag