title: How do I avoid a page break immediately after a heading
body: <p>I have an HTML 4.01/CSS 2.1 document that includes an H3 heading followed by a short (one line) paragraph block and then an unordered list with several items:</p>
  
  <pre><code>&lt;h3&gt;Heading!&lt;/h3&gt;
  
  &lt;p&gt;Some things:&lt;/p&gt;
  
  &lt;ul&gt;
    &lt;li&gt;Thing one&lt;/li&gt;
    &lt;li&gt;Thing B&lt;/li&gt;
    &lt;li&gt;Thing 4&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>My problem is that when I print the document (or render it as a PDF using <code>wkhtmltopdf</code>), sometimes a page break will occur right after the heading, before the paragraph, which looks quite silly.</p>
  
  <p>Is there a way to stipulate that page breaks should be avoided immediately after a header? (I'm not averse to HTML5/CSS3 solutions, if that simplifies things significantly.)</p>
  
  <p><strong>Note:</strong> following suggestions, I tried using the CSS property <code>page-break-after: avoid</code>. This doesn't really work in any <a href="https://bugs.webkit.org/show_bug.cgi?id=5097" rel="noreferrer">WebKit</a> or <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=132035" rel="noreferrer">Mozilla</a> based browsers, though.</p>