title: Using CSS print media with Xporability/css-to-pdf
body: <p>I'm using <a href="https://github.com/Xportability/css-to-pdf" rel="nofollow">https://github.com/Xportability/css-to-pdf</a> to load HTML tables into a PDF. All is working fine except for being able to insert page breaks between the tables. Using this code:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html lang="us"&gt;
  &lt;head&gt;
     &lt;meta charset="utf-8"&gt;
     &lt;title&gt;XEPjqPlugin&lt;/title&gt; 
     &lt;style&gt;
         @media print {
             .noprint {display:none;}
             .print {width:100%; display:table-header-group;}
             body, article {width: 100%; margin: 0; padding: 0; font-size: 10pt; font-family:'Times New Roman',Times,serif;}
             table { page-break-after: always;}
         }
     &lt;/style&gt;
     &lt;script src="js/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
     &lt;script src="js/xepOnline.jqPlugin.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div class="report"&gt;
          &lt;div id="tablePage"&gt;
             &lt;input class="noprint" name="tablepage" type="checkbox"&gt;
                 &lt;a class="noprint nodec" id="printit" href="#"
                     onclick="return xepOnline.Formatter.Format('tablePage',{pageMargin:'0.5in'});"
                     &gt;&lt;img src="css/Images/button-print.png" /&gt;
             &lt;div&gt;
                  &lt;table id="table1" border="1"&gt;
                     &lt;tr&gt;
                          &lt;th&gt;Column 1&lt;/th&gt;
                          &lt;th&gt;Column 2&lt;/th&gt;
                          &lt;th&gt;Column 3&lt;/th&gt;
                     &lt;/tr&gt;
                     &lt;tr&gt;
                          &lt;td rowspan="2"&gt;Row 1 Cell 1&lt;/td&gt;
                          &lt;td&gt;Row 1 Cell 2&lt;/td&gt;&lt;td&gt;Row 1 Cell 3&lt;/td&gt;
                     &lt;/tr&gt;
                     &lt;tr&gt;
                          &lt;td&gt;Row 2 Cell 2&lt;/td&gt;
                          &lt;td&gt;Row 2 Cell 3&lt;/td&gt;
                     &lt;/tr&gt;
                     &lt;tr&gt;
                          &lt;td colspan="3"&gt;Row 3 Cell 1&lt;/td&gt;
                     &lt;/tr&gt;
                 &lt;/table&gt;
             &lt;/div&gt;
             &lt;div&gt;
                  &lt;table id="table2" border="1"&gt;
                     &lt;tr&gt;
                          &lt;th&gt;Column 1&lt;/th&gt;
                          &lt;th&gt;Column 2&lt;/th&gt;
                          &lt;th&gt;Column 3&lt;/th&gt;
                     &lt;/tr&gt;
                     &lt;tr&gt;
                          &lt;td rowspan="2"&gt;Row 1 Cell 1&lt;/td&gt;
                          &lt;td&gt;Row 1 Cell 2&lt;/td&gt;&lt;td&gt;Row 1 Cell 3&lt;/td&gt;
                     &lt;/tr&gt;
                     &lt;tr&gt;
                          &lt;td&gt;Row 2 Cell 2&lt;/td&gt;
                          &lt;td&gt;Row 2 Cell 3&lt;/td&gt;
                     &lt;/tr&gt;
                     &lt;tr&gt;
                          &lt;td colspan="3"&gt;Row 3 Cell 1&lt;/td&gt;
                     &lt;/tr&gt;
                 &lt;/table&gt;
             &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;   
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The @media print style isn't having any effect. The .noprint and page-break have not effect.</p>