title: How to keep Quill from inserting blank paragraphs (`<p><br></p>`) before headings with a 10px top margin?
body: <h1>Background</h1>
  <p>CSS</p>
  <pre><code>.ql-editor h3 {
    margin-top: 10px !important;
  }
  </code></pre>
  <p>HTML source (to be edited with Quill)</p>
  <pre><code>&lt;div id=&quot;editor&quot;&gt;
  &lt;h1&gt;A Title&lt;/h1&gt;
  &lt;p&gt;hello&lt;/p&gt;
  &lt;h3&gt;A Heading&lt;/h3&gt;
  &lt;/div&gt;
  </code></pre>
  <p>The JavaScript for starting Quill is:</p>
  <pre><code>var quill = new Quill('#editor', {
    theme: 'snow'
  });
  </code></pre>
  <p>Quill.js turns it into this (I'm adding line feeds for clarity):</p>
  <pre><code>&lt;div class=&quot;ql-editor&quot; contenteditable=&quot;true&quot;&gt;
  &lt;h1&gt;A Title&lt;/h1&gt;
  &lt;p&gt;hello&lt;/p&gt;
  &lt;p&gt;&lt;br&gt;&lt;/p&gt;
  &lt;h3&gt;A Heading&lt;/h3&gt;
  &lt;/div&gt;
  </code></pre>
  <h1>Question</h1>
  <p>Where did the <code>&lt;p&gt;&lt;br&gt;&lt;/p&gt;</code> come from and how can I get rid of it?  I want the edits to look like the real thing and we use a top margin on all our headings.  A solution that stops Quill from overwriting our styles would be really nice.</p>
  <h1>Notes</h1>
  <ul>
  <li>The <code>.ql-editor h3</code> style with a <code>margin-top</code> of <code>10px</code> or greater seems critical for causing this issue.  Even with <code>9px</code> the issue goes away.</li>
  <li>Here is the <a href="http://codepen.io/anon/pen/RVgeBB" rel="noreferrer">Quill Playground showing the issue</a></li>
  </ul>
  <h1>Versions</h1>
  <ul>
  <li>Quill version 1.2.4</li>
  <li>Chrome Version 58.0.3029.81 (64-bit)</li>
  <li>Ubuntu 16.04 (64-bit)</li>
  </ul>