title: CSS: inline a <pre> tag
body: <p>Here is my HTML:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;p&gt;The following text &lt;pre&gt;is an inline preformat block&lt;/pre&gt; and will not be parsed.&lt;/p&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I want it rendered as a single line, with a preformat block in the middle of the sentence.  However, it is rendering as three separate lines:</p>
  
  <hr>
  
  <p>The following text <pre>is an inline preformat block</pre> and will not be parsed.</p>
  
  <hr>
  
  <p>And what I want is for it all to be on one single line.  I have tried setting the style to use <code>display:inline</code>, but that only solves my problem halfway: no newline is introduced at the end of the pre block, but there is still one at the start.</p>
  
  <p>As has been suggested elsewhere, I tried using <code>white-space:nowrap</code>, but it accomplishes absolutely nothing at all.</p>
  
  <p>No solutions based on javascript or jquery, please.  I want to make sure the solution works on browsers which have scripting disabled.</p>