simplest thing to do would be to add a width="99%"  in pre tag

When the width is set to 100%, you’ll get a horizontal scrollbar when viewing in IE7. That’s why Iâ€â„ÃâÃÂÃââ
¬Å¡Ãƒâ€šÃ‚¢ÃƒÆ’ƒÂ¢Ã¢â€šÂ¬Ã…¡Ã‚¬Ã…¡Ãƒâ€šÃ‚¢ve set the width to 99%. The code will display just fine in IE6, IE6, and FireFox when width is set to 99%.

or use this css add it to the html page

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap !important;  /* 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+ */
}