WordPress Code Snippets

A fresh mix of code snippets and tutorials

CSS cross-browser whitespace rules

63

If you’ve ever tried to make whitespace behave across all browsers, you’ll appreciate today’s snippet.

When included in your CSS file, this code will ensure that lines wrap within the element.

width: 500px;                          /* specify width   */
white-space: pre;                      /* CSS2.0 browsers */
white-space: pre-wrap;                 /* CSS2.1 browsers */
white-space: pre-line;                 /* CSS3 and CSS2.1 */
white-space: -moz-pre-wrap !important; /* 1999+ Mozilla   */
white-space: -hp-pre-wrap;             /* for HP printers */
white-space: -o-pre-wrap;              /* Opera 7 and up  */
white-space: -pre-wrap;                /* Opera 4 thru 6  */
word-wrap: break-word;                 /* IE 5.5+ and up  */
_white-space: pre;                     /* restate for IE  */
/* overflow-x: auto; */                /* Firefox 2 only  */
/* width: 99%; */                      /* only if needed  */

Customize as you please!


Show Support

Like our new Facebook Page to show support!