I have to create dynamically a PDF file using Mpdf. The page/s contain multiple tables.
I would like to move the table to the next page if it doesn't fit in the page. At the moment it brokes in 2 pieces (once piece in one page, check the image I added).
Is there any possibility to move the table to the next page? Like I said, I create the file dynamically, so I don't know how many tables I have or how long will be the last row (with text) of the table.
[![At the end, it breaks in 2 pieces][1]][1]
Here is a table example:
body {
font-family: Arial;
line-height:12px;
color: #000000;
font-size:10px;
}
p{
margin: 0 0 10px;
}
h1 {
text-transform: uppercase;
font-size: 16px;
font-weight: bold;
margin-bottom:15px;
}
.nabidka-container {
width:1000px;
margin: 0 auto;
}
.nabidka-container .products:first-child {
margin-bottom:40px;
}
.nabidka-container .products{
border-collapse: collapse;
margin: 35px 0 40px 0;
table-layout: fixed;
width: 100%;
overflow:wrap;
display:block;
page-break-inside:auto
}
.nabidka-container .products,.nabidka-container .products tr td, .nabidka-container .products tr th {
page-break-inside: initial !important;
}
.nabidka-container .products td {
width:25%;
border: 1px solid gray;
padding:2px;
text-align: center;
}
.nabidka-container .products td.foto {
border: 0px;
}
.nabidka-container .products td.bezramu {
border: 0px;
background-color: #ffffff;
}
.nabidka-container .products .tab_popis {
width: 200px;
}
.nabidka-container .products .tab_hodnoty {
width: 50px;
}
.nabidka-container .products .bold {
font-weight: bold;
}
.nabidka-container .products .italic {
font-style: italic;
}
.nabidka-container .products .left {
text-align: left;
}
.nabidka-container .products .right {
text-align: right;
}
.nabidka-container .products .price {
background-color: #cecece;
font-weight: bold;
}<div class="nabidka-container">
<table class="products" style="width:100%">
<tbody>
<tr>
<td class="tab_popis foto"> </td>
<td class="tab_hodnoty foto"><img src="https://devlocal.optimtop.cz/storage/files/sources/images/products/p283_01_small.jpg" class="foto"></td>
<td class="tab_hodnoty foto"><img src="https://devlocal.optimtop.cz/storage/files/sources/images/products/p213_01_small.jpg" class="foto"></td>
<td class="tab_hodnoty foto"><img src="https://devlocal.optimtop.cz/storage/files/sources/images/products/p275_01_small.jpg" class="foto"></td>
<td class="tab_hodnoty foto"><img src="https://devlocal.optimtop.cz/storage/files/sources/images/products/p188_01_small.jpg" class="foto"></td>
</tr>
<tr>
<td class="tab_popis foto"> </td>
<td class="tab_hodnoty bold">Válcové brikety</td>
<td class="tab_hodnoty bold">Brikety RUF</td>
<td class="tab_hodnoty bold">Brikety RUF</td>
<td class="tab_hodnoty bold">Noční brikety</td>
</tr>
<tr>
<td class="tab_popis left">Kód</td>
<td class="tab_hodnoty">DBVMPR800</td>
<td class="tab_hodnoty">RUFHEX840</td>
<td class="tab_hodnoty">RUFMEX840</td>
<td class="tab_hodnoty">NOCVB720</td>
</tr>
<tr>
<td class="tab_popis left">Hmotnost balení</td>
<td class="tab_hodnoty">10 kg</td>
<td class="tab_hodnoty">10 kg</td>
<td class="tab_hodnoty">10 kg</td>
<td class="tab_hodnoty">10 kg</td>
</tr>
<tr>
<td class="tab_popis left">Hmotnost palety</td>
<td class="tab_hodnoty">800 kg</td>
<td class="tab_hodnoty">840 kg</td>
<td class="tab_hodnoty">840 kg</td>
<td class="tab_hodnoty">720 kg</td>
</tr>
<tr>
<td class="tab_popis left">Počet balení na pal.</td>
<td class="tab_hodnoty">80</td>
<td class="tab_hodnoty">84</td>
<td class="tab_hodnoty">84</td>
<td class="tab_hodnoty">72</td>
</tr>
<tr>
<td class="tab_popis left">Průměrná výhřevnost</td>
<td class="tab_hodnoty">18.8 MJ/kg</td>
<td class="tab_hodnoty">18.5 MJ/kg</td>
<td class="tab_hodnoty">18 MJ/kg</td>
<td class="tab_hodnoty">18 MJ/kg</td>
</tr>
<tr>
<td class="tab_popis left price">Cena/ks</td>
<td class="tab_hodnoty price">41.88 Kč</td>
<td class="tab_hodnoty price">46.43 Kč</td>
<td class="tab_hodnoty price">40.48 Kč</td>
<td class="tab_hodnoty price">53.47 Kč</td>
</tr>
<tr>
<td class="tab_popis left price">Cena/paleta</td>
<td class="tab_hodnoty price">3350 Kč</td>
<td class="tab_hodnoty price">3900 Kč</td>
<td class="tab_hodnoty price">3400 Kč</td>
<td class="tab_hodnoty price">3850 Kč</td>
</tr>
<tr>
<td class="tab_popis left price">Cena/tuna</td>
<td class="tab_hodnoty price">4188 Kč</td>
<td class="tab_hodnoty price">4643 Kč </td>
<td class="tab_hodnoty price">4048 Kč</td>
<td class="tab_hodnoty price">5347 Kč</td>
</tr>
<tr>
<td class="tab_popis bezramu"></td>
<td class="tab_hodnoty italic ">SUPER CENA průměr 9 mm</td>
<td class="tab_hodnoty italic ">100% buk</td>
<td class="tab_hodnoty italic ">SUPER CENA dub,buk,jasan</td>
<td class="tab_hodnoty italic ">dlouhá doba žhnutí</td>
</tr>
</tbody>
</table>
</div>Thanks for your help.
I manage to fix it using page-break-inside: avoid. But you need to add $mpdf->shrink_tables_to_fit = 1; to your mpdf object or attribute autosize="1" to your table element. (without shrink_tables_to_fit or autosize, it will add one table to one page (at least that was the behaviour in my case).
For more info about table shrink check Tables - Tables - mPDF Manual