page-break-* doesn't work on Chrome and Safari
<p>I know that there're lots of questions on this topic, but I still could not find a working solution. So, here's my html:</p>

<pre><code>&lt;div class="row"&gt;
    &lt;div class="col-xs-12"&gt;
      &lt;div class="row print-break"&gt;
        &lt;div class="col-xs-8 col-xs-offset-2"&gt;
          &lt;!-- Some Content --&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="row print-break"&gt;
        &lt;div class="col-xs-8 col-xs-offset-2"&gt;
          &lt;!-- Some Content --&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="row print-break"&gt;
        &lt;div class="col-xs-8 col-xs-offset-2"&gt;
          &lt;!-- Some Content --&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
</code></pre>

<p>And css:</p>

<pre><code>@media print {
   .print-break {
      page-break-after: always;
      page-break-inside: avoid;
   }
}
</code></pre>

<p>And it happens that Firefox insert page breaks properly; Chrome and Safari doesn't.</p>

<p>Do anyone know how to overcome this? Or where am I possibly wrong?</p>