You have done this. You paste a code snippet into a blog post, a comment box, or a CMS field, hit save, and half of it vanishes. The <div> you typed is gone. The & in "Tom & Jerry" turned into something weird. A <script> tag someone typed into a form actually ran.

It is not a bug in your editor. It is HTML doing exactly what it was designed to do: angle brackets mean "a tag starts here", and ampersands mean "an entity starts here". When you want those characters to show up as plain text, you have to tell the browser so, by writing them as HTML entities.

The five characters that matter

Almost every encoding problem comes down to five characters:

& becomes &amp;

< becomes &lt;

> becomes &gt;

" becomes &quot;

' becomes &#39;

That is the whole list for safe output. Encode those five and your text displays exactly as typed, in every browser, with no surprises.…