People who have been following this site for a while know that we recently released an entirely new theme and look.
As always when moving to a new “platform” things work differently. As I was going through old posts to answer comments I noticed some posts with <PRE> code-wraps extended outside the main <DIV>.
Luckily I knew exactly how to fix the problem and now I am going to show you how to fix it.
The <PRE> problem
Notice the code is going outside the main div:
The Easy CSS Fix
Simply add the following CSS to your stylesheet and its fixed!
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
The White-Space Property & Why Does It Fix It?
The white-space property tells the browser how to handle “white-space” inside of a div container.
By default any <pre> tag will not wrap at all, rather it will preserve the full lines of your code. By using the “pre-wrap” value you are telling the browser to wrap the text when necessary and on line breaks to keep everything inside the containing div.
