CSS Code Block Formatting. Keeps Your Design Intact.

I am not sure who came up with this little nugget. I have seen it around a few times, but who ever you are, I love you…

If you ever have the need to share blocks via an HTML page (like this blog) that others will copy and paste from, use the CSS style below. Your web visitors will appreciate it. Plus, it will also keep your design from exploding due to long lines of code.

pre {

white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap !important; 
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */

}

pre {

white-space: pre-wrap; /* css-3 */

white-space: -moz-pre-wrap !important;

white-space: -pre-wrap; /* Opera 4-6 */

white-space: -o-pre-wrap; /* Opera 7 */

word-wrap: break-word; /* Internet Explorer 5.5+ */

}

ultraweaver

going beyond the basics

CSS Code Block Formatting. Keeps Your Design Intact.

Leave a Reply Cancel reply