title: Prevent newline break with span and p tag
body: <p>I have some CSS which inserts a dash, unicode U+2014 —,  to give a nice formatting on <a href="http://biochemistri.es" rel="nofollow noreferrer">my site</a> ahead of the stated source. Annoyingly it is breaking a new line after this (I've tried changing from span to div but no use).</p>
  
  <p><img src="https://i.stack.imgur.com/eqsSB.png" alt="Screenshot inspecting the element in Chrome"></p>
  
  <p>The document tree looks like:</p>
  
  <pre><code>&lt;span class="source"&gt;...&lt;/span&gt;
  &lt;p&gt;Source author, text goes here etc. etc.&lt;/p&gt;
  </code></pre>
  
  <p>The computed style for the <code>span</code> line includes <code>display:inline</code>, whereas the computed style for <code>p</code> has <code>display:block</code>, which I'm guessing may be causing the new line?</p>
  
  <p>I'm reading through the relevant CSS and can't see any reason why it should start a new line, I don't have <a href="https://stackoverflow.com/questions/17047694/add-line-break-to-before-or-after-pseudo-element-content">\A in the content as in this question</a> ... </p>
  
  <p>Can any CSS whiz point me to what I'm missing? Alternative implementation of the <code>::before</code> pseudo-element required perhaps?</p>
  
  <p>The CSS involved here is</p>
  
  <pre><code>div.source:before{content:"\2014";margin-left:0.9em;margin-right:0.9em; white-space:nowrap;}#content
  </code></pre>
  
  <p>(I inserted white-space:nowrap a while ago trying to fix this but it didn't do anything to the new line)</p>