title: CSS Page Break Before (Left & Right) Not Working
body: <p>My goal is to print from the browser a series of letters.  For users who print the letters on both sides of the paper, I want to ensure that a new letter never starts on the back side of the previous letter.  Letters vary in length, some being 2 pages and others being 3.</p>
  
  <p>It appears that the following CSS should resolve this:</p>
  
  <pre><code>page-break-before: left
  </code></pre>
  
  <p>However, when I put together a sample, it does not seem to work as expected.</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;style&gt;
  h2.left { page-break-before: left; }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;h2 class="left"&gt;New Section&lt;/h2&gt;
  &lt;h2 class="left"&gt;New Section&lt;/h2&gt;
  &lt;h2 class="left"&gt;New Section&lt;/h2&gt;
  &lt;h2 class="left"&gt;New Section&lt;/h2&gt;
  &lt;h2 class="left"&gt;New Section&lt;/h2&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><b>I'd expect the code to print out 9 pages, with a blank page between each to force the next one to the "left".</b>  In reality the print preview simply shows each h2 on it's own page with a single blank page at the beginning.</p>
  
  <p>Am I misunderstanding how this CSS works or is my implementation incorrect?</p>
  
  <p><i>Update: I've tested this in Chrome, Safari, and Opera - none of which seem to work as expected.</i></p>