title: php table break page with no rows on next page
body: <p>I am having a php table which contains information about billing of certain numbers. After generating this table I export it in pdf using mpdf.
  If the table has a certain number of rows it breaks the page in a weird way, leading the headers repeat on the next page with no rows.
  Here is the format of the table:</p>
  <p>The table contains up to 3 headers inside <code>&lt;thead&gt;</code> tags, like this:</p>
  <pre><code>&lt;table class=&quot;items&quot; width=&quot;100%&quot; style=&quot;font-size: 9pt; border-collapse: collapse;&quot; cellpadding=&quot;8&quot;&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;td width=&quot;30.3%&quot;&gt;Forbrug&lt;/td&gt;
              &lt;td width=&quot;23.1%&quot;&gt;Periode&lt;/td&gt;
              &lt;td width=&quot;10.76%&quot;&gt;Tid/MB&lt;/td&gt;
              &lt;td width=&quot;9.28%&quot;&gt;Enheder&lt;/td&gt;
              &lt;td width=&quot;12.9%&quot; align=&quot;right&quot;&gt;I alt&lt;/td&gt;
              &lt;td width=&quot;13.3%&quot; align=&quot;right&quot;&gt;I alt+&lt;b&gt;moms&lt;/b&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
  </code></pre>
  <p>rows are added in a while from the database in this way.. nothing special</p>
  <pre><code>&lt;tr&gt;
      &lt;td&gt;'.$produktNameFromDatabase.'&lt;/td&gt;
      &lt;td&gt;'.$periodeFromDatabase.'&lt;/td&gt;
      &lt;td&gt;'.$tidMbFromDatabase.'&lt;/td&gt;
      &lt;td&gt;'.$enhederFromDatabase.'&lt;/td&gt;
      &lt;td align=&quot;right&quot;&gt;'.number_format((float)$produktpris, 2, ',', '.').' kr.&lt;/td&gt;
      &lt;td align=&quot;right&quot;&gt;&lt;b&gt;'.number_format((float)$produktpris*(1 + (0.25 * $moms)) - $momsDiscount, 2, ',', '.').' kr.&lt;/b&gt;&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  <p>with the total lines at the end</p>
  <pre><code>        &lt;tr&gt;
              &lt;td class=&quot;blanktotal&quot; colspan=&quot;1&quot; rowspan=&quot;6&quot;&gt;&lt;/td&gt;
              &lt;td class=&quot;blanktotal&quot; colspan=&quot;1&quot; rowspan=&quot;6&quot;&gt;&lt;/td&gt;
              &lt;td class=&quot;totals&quot; colspan=&quot;2&quot;&gt;Subtotal:&lt;/td&gt;
              &lt;td class=&quot;totals&quot; colspan=&quot;2&quot;&gt;'.number_format((float)$pris1, 2, ',', '.').' kr.&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td class=&quot;totals1&quot; colspan=&quot;2&quot;&gt;Moms:&lt;/td&gt;
              &lt;td class=&quot;totals1&quot; colspan=&quot;2&quot;&gt;'.number_format((float)$pris1*(0.25 * $moms) - $momsTotal, 2, ',', '.').' kr.&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td class=&quot;totals1&quot; colspan=&quot;2&quot;&gt;&lt;b&gt;TOTAL:&lt;/b&gt;&lt;/td&gt;
              &lt;td class=&quot;totals1&quot; colspan=&quot;2&quot;&gt;&lt;b&gt;'.number_format((float)$pris1*(1 + (0.25 * $moms)) - $momsTotal, 2, ',', '.').' kr.&lt;/b&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  <p><strong>!!! EVERYTHING that you have seen by now, including the totals are a part of the table!</strong></p>
  <p>Here is the mpdf settings that I have:</p>
  <p>In PhP:</p>
  <pre><code>$mpdf=new mPDF('win-1252','A4','','',20,15,48,25,10,10);
  $mpdf-&gt;useOnlyCoreFonts = true;    // false is default
  $mpdf-&gt;SetProtection(array('print'));
  $mpdf-&gt;SetTitle(&quot;Suggestive Title&quot;);
  $mpdf-&gt;SetAuthor(&quot;Author&quot;);
  $mpdf-&gt;SetWatermarkText(&quot;Faktura&quot;);
  $mpdf-&gt;showWatermarkText = true;
  $mpdf-&gt;watermark_font = 'DejaVuSansCondensed';
  $mpdf-&gt;watermarkTextAlpha = 0.1;
  $mpdf-&gt;SetDisplayMode('fullpage');
  </code></pre>
  <p>In HTML:</p>
  <pre><code>$html .= '&lt;!--mpdf
      &lt;htmlpageheader name=&quot;myheader&quot;&gt;
          &lt;table width=&quot;100%&quot;&gt;&lt;tr&gt;
              &lt;td width=&quot;50%&quot; style=&quot;color:#000000;&quot;&gt;
                  &lt;span style=&quot;font-weight: bold; font-size: 14pt;&quot;&gt;
                      Company Name
                  &lt;/span&gt;
                  Company Information
              &lt;/td&gt;
              &lt;td width=&quot;50%&quot; style=&quot;text-align: right;&quot;&gt;
                  &lt;img src=&quot;image.jpg&quot; /&gt;
                      Invoice Information &lt;br /&gt;Side: {PAGENO} af {nb}
                  &lt;/td&gt;
          &lt;/tr&gt;&lt;/table&gt;
      &lt;/htmlpageheader&gt;
      
      &lt;htmlpagefooter name=&quot;myfooter&quot;&gt;
          &lt;div style=&quot;border-top: 1px solid #000000; font-size: 9pt; text-align: center; padding-top: 3mm; &quot;&gt;
              Footer Stuff
          &lt;/div&gt;
          &lt;div style=&quot;font-size: 9pt; text-align: center;&quot;&gt;
              Other Footer Stuff
          &lt;/div&gt;
      &lt;/htmlpagefooter&gt;
      
      &lt;sethtmlpageheader name=&quot;myheader&quot; value=&quot;on&quot; show-this-page=&quot;1&quot; /&gt;
      &lt;sethtmlpagefooter name=&quot;myfooter&quot; value=&quot;on&quot; /&gt;
  mpdf--&gt;';
  </code></pre>
  <p>Some styling that I use</p>
  <pre><code>body {font-family: sans-serif;
      font-size: 10pt;
  }
  p { margin: 0pt;
  }
  td { vertical-align: top; }
  .items td {
      border-left: 0.1mm solid #000000;
      border-right: 0.1mm solid #000000;
  }
  table thead td { background-color: #d4ffaa;
      border: 0.1mm solid #000000;
  }
  .items td.blanktotal {
      background-color: #FFFFFF;
      border: 0mm none #000000;
      border-top: 0.1mm solid #000000;
      border-right: 0.0mm solid #000000;
  }
  .items td.totals {
      text-align: right;
      border-top: 0.1mm solid #000000;
      border-right: 0.0mm solid #000000;
      border-left: 0.0mm solid #000000;
  }
  .items td.totals1 {
      text-align: right;
      border-top: 0.0mm solid #000000;
      border-right: 0.0mm solid #000000;
      border-left: 0.0mm solid #000000;
  }
  </code></pre>
  <p>The result looks something like this:</p>
  <p><img src="https://i.stack.imgur.com/gjHUM.png" alt="enter image description here" /></p>
  <p>This issue occurs <em><strong>only</strong></em> when the number of rows <em><strong>fills the page</strong></em>. If it overflows it is no major issue, because the table headers are still there on the next page (all of them unfortunately, not only the last one) and the rest of the rows are added further.</p>
  <p>How can I get rid of those empty rows, <em><strong>in this special case</strong></em>?</p>
  <p>Thank you!</p>
  <p><strong>!!EDIT:</strong>  <em><strong>Added more information, code and a better image of the case. Sorry for not doing it at the first time!</strong></em></p>
  <p><strong>!!EDIT #2:</strong>  <em><strong>I just observed on other examples that had more than 1 page of rows that the <code>&lt;thead&gt;</code>s keep their position on next pages. It happens all the time. Is there a way to disable that so that other <code>&lt;thead&gt;</code>s will just continue on the next page from the top of the page without remembering the position from the previous page?</strong></em></p>