2016-12-04 1 views
0

J'essaye de créer un PDF qui contient une table partiellement remplie, partiellement vide. Pour ce faire, j'utilise DomPDF via un Laravel wrapper.Dompdf tables avec des cellules vides

Il semble que DomPDF calcule d'une manière ou d'une autre la hauteur des cellules vides et déplace également la grille et le contenu de la table.

Voici un exemple cassé minimal:

<html> 
 
<head> 
 
    <style> 
 
     html, body { 
 
\t \t \t font-family: DejaVu Sans; 
 
\t \t } 
 
\t \t 
 
\t \t table { 
 
\t \t \t border-collapse: collapse; 
 
\t \t \t border: none; 
 
      margin: 0; 
 
\t \t \t width: 100%; 
 
\t \t } 
 
\t \t 
 
\t \t table.main td { 
 
      padding: 0; 
 
\t \t \t border: 2px solid black; 
 
\t \t } 
 
\t \t 
 
\t \t .main table td { 
 
\t \t \t border: 1px black solid; 
 
\t \t \t text-align: center; 
 
\t \t \t font-size: 10px; 
 
\t \t \t height: 14px; 
 
\t \t } 
 
\t </style> 
 
</head> 
 

 
<body> 
 
\t <table class="main"> 
 
\t \t <tr> 
 
\t \t \t <td> 
 
\t \t \t \t <table> 
 
\t \t \t \t \t <tr><td>1</td></tr> 
 
\t \t \t \t \t <tr><td>2</td></tr> 
 
\t \t \t \t \t <tr><td>3</td></tr> 
 
\t \t \t \t \t <tr><td>4</td></tr> 
 
\t \t \t \t \t <tr><td>5</td></tr> 
 
\t \t \t \t \t <tr><td>6</td></tr> 
 
\t \t \t \t \t <tr><td>7</td></tr> 
 
\t \t \t \t \t <tr><td>8</td></tr> 
 
\t \t \t \t \t <tr><td>9</td></tr> 
 
\t \t \t \t \t <tr><td>10</td></tr> 
 
\t \t \t \t </table> 
 
\t \t \t </td> 
 
\t \t \t <td> 
 
\t \t \t \t <table> 
 
\t \t \t \t \t <tr><td>1</td></tr> 
 
\t \t \t \t \t <tr><td>2</td></tr> 
 
\t \t \t \t \t <tr><td>3</td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t \t <tr><td></td></tr> 
 
\t \t \t \t </table> 
 
\t \t \t </td> 
 
\t \t </tr> 
 
\t </table> 
 
</body> 
 
</html>

Voici comment cette table ressemble dans le PDF généré:

enter image description here

J'ai essayé d'ajouter min-height et max-height pour la cellule de table, mais pas de res ults, il désaligne toujours aléatoirement tout.

Répondre

0

Il s'avère que cela nécessite que line-height soit réglé exactement égal à la taille de la police. Cela fonctionnera:

.main table td { 
     border: 1px black solid; 
     text-align: center; 
     font-size: 10px; 
     line-height: 10px; 
     height: 14px; 
    } 
+0

Il est vrai que les déclarations de hauteur min/max ne fonctionnent pas très bien maintenant lorsqu'elles sont utilisées avec des tables. En plus de définir la hauteur de ligne, vous pouvez également fournir un caractère non imprimable (par exemple ' ') pour remplir l'espace avec du contenu de taille pour développer la cellule. – BrianS