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+ */
}
Search

Popular Posts

Small Biz Website Tips Newsletter

Stay up to date with the latest marketing, sales, and service tips and news.

Small Biz Website Tips Newsletter

Stay up to date with the latest marketing, sales, and service tips and news.