How to Wrap Text within the <pre> Tag Using CSS

I just came across an issue where I needed to make sure that the text within a <pre> tag wrapped. The default for this tag it to just let the text run on, no matter if the site’s page has ended. Not very good, if you ask me.

All you need to do is add this one pieces of code to your stylesheet and your text will wrap nicely.

pre {
  white-space: pre-wrap;       /* css-3 */
  white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */
}