html - CSS: inline a <pre> tag -

here html:

<p>the following text <pre>is inline preformat block</pre> , not parsed.</p>

i want rendered single line, preformat block in middle of sentence. however, rendering 3 separate lines:

---

the following text

is inline preformat block

, not parsed.

---

and want on 1 single line. have tried setting style use display:inline, solves problem halfway: no newline introduced @ end of pre block, there still 1 @ start.

as has been suggested elsewhere, tried using white-space:nowrap, accomplishes absolutely nothing @ all.

no solutions based on javascript or jquery, please. want make sure solution works on browsers have scripting disabled.

solution #1 using <pre> (not recommended):
can use following code, <p> element little bit broken. if want avoid affect <p> elements, add class or id attribute <p> element.

pre, p {    display:inline;  }

<p>the following text <pre>is inline preformat block</pre> , not parsed.</p>

solution #2 using <code>:
better solution replace <pre> <code>. output looks same solution using <pre> element.

<p>the following text <code>is inline preformat block</code> , not parsed.</p>

solution #3 using <span>:
if want define element can use following:

p span {    font-family:monospace;  }

<p>the following text <span>is inline preformat block</span> , not parsed.</p>