I have a pre tag within my page that contains quite a bit of text. When I preview this page in the browser it looks fine. But when I go to print it, everything within the pre tag is printed on a new page. It is like the pre tag is causing a page break.
I am using css to word wrap the text of the pre tag.
Below is a sample. If you preview it in the browser it looks fine, but if you do a print preview you can see how everything in the pre tag is showing up in a new page. Same behavior in both IE7 and FF3.
Any way to make this print correctly?
<html>
<head>
<title>Item</title>
</head>
<body>
<p>Lets put some other stuff here. </p>
<p>Lets put some other stuff here. </p>
<p>Lets put some other stuff here. </p>
<p>Lets put some other stuff here. </p>
<p>Lets put some other stuff here. </p>
<p>Lets put some other stuff here. </p>
<p>Lets put some other stuff here. </p>
<pre style="overflow-x: auto; width:99%; font-size:14px; font-family:Arial; word-wrap: break-word; white-space: -moz-pre-wrap;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sit amet mauris ipsum, eget porttitor neque. Nunc eget eros eget turpis sagittis tincidunt quis vel leo. Praesent pretium, nisi sit amet ornare iaculis, justo nisi imperdiet libero, nec condimentum lacus metus eu diam. Cras eu eros id justo mollis pulvinar eget quis nisl. Proin gravida rutrum semper. Nunc erat lorem, volutpat at venenatis non, egestas eu magna. Vivamus nec lectus a justo hendrerit placerat. Aenean commodo, sem et facilisis sodales, tellus tortor sagittis ipsum, id interdum tortor velit sit amet massa. Maecenas placerat sollicitudin mollis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse feugiat quam eget erat ornare vel ornare tortor fermentum. Cras at pulvinar turpis. Fusce ut magna eros, ut tristique tortor. Proin pulvinar fermentum massa eu rhoncus. In et sem ante. Sed malesuada dictum ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque enim sapien, pretium eget lacinia sit amet, mattis eget neque.
Fusce ac nibh non arcu varius sodales ac sed massa. Fusce dapibus tincidunt nisl, et semper justo tincidunt nec. Phasellus rutrum hendrerit velit in posuere. Sed quis tempor urna. Aliquam eget nisl massa. Mauris ac erat vitae tortor molestie venenatis eget pretium velit. Curabitur id congue turpis. Quisque nec interdum nulla. In vitae libero a velit vehicula scelerisque vel nec lacus. Aliquam erat volutpat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum dictum facilisis neque.
Pellentesque elit ante, suscipit ut suscipit eu, placerat euismod sapien. Integer eu porttitor sapien. Curabitur sit amet elit at metus rutrum laoreet. Sed dignissim, dui vitae scelerisque imperdiet, est purus mattis urna, eget condimentum urna libero at libero. Praesent feugiat, nisl vitae cursus viverra, magna sem luctus ante, scelerisque vestibulum ligula mauris eget turpis. Nullam eget dapibus ante. Vestibulum interdum tincidunt velit, et tempor arcu euismod id. Donec vitae nibh nulla. Nulla quis mi quis nisl iaculis interdum. Aenean tincidunt felis semper orci scelerisque eget vulputate massa suscipit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In hac habitasse platea dictumst. Mauris tincidunt, est id suscipit porttitor, ipsum massa ultricies nunc, at tincidunt odio tellus quis est. Morbi vel turpis dolor. Mauris id turpis viverra tellus malesuada mattis a consectetur libero. Suspendisse sed turpis nibh. Cras vulputate arcu et risus fermentum fermentum.
Nulla molestie diam consequat nisi mollis viverra. Ut non quam erat, sit amet pellentesque metus. Etiam nec sem id nisl scelerisque tristique. Curabitur molestie nibh aliquam justo sollicitudin sodales. Praesent sit amet nunc lobortis diam dignissim venenatis. Ut ipsum quam, rutrum id tempus at, porttitor eget justo. Nulla non malesuada velit. Duis laoreet mi nec turpis adipiscing lacinia. Duis nec libero massa. Cras elit felis, commodo sit amet tincidunt ut, commodo vitae augue. Nulla vitae magna ut lacus aliquam malesuada quis eu tellus. Maecenas aliquet urna tortor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
Mauris in lorem vel leo tempus eleifend. Nunc augue mauris, pellentesque quis blandit eget, ultricies nec mauris. Nullam posuere laoreet elit, vitae ullamcorper lorem bibendum at. Maecenas aliquet aliquet ligula vitae rhoncus. Curabitur est diam, commodo a porttitor in, imperdiet et lorem. Proin iaculis fringilla tortor sed bibendum. Nullam facilisis mauris et metus interdum tristique. Sed fermentum erat justo, eget rhoncus nibh. Fusce aliquam feugiat leo sodales condimentum. Maecenas tincidunt odio nec dui consequat sit amet dictum felis molestie. Ut id feugiat velit. Maecenas eget lacus at ligula porttitor consequat. Vestibulum ultrices, ante ut ornare hendrerit, metus mauris pellentesque neque, sed sodales diam diam a elit.
</pre>
</body>
</html>
Note It seems that the line breaks within the code section are not being maintained. So if you copy/paste this code you'll need to add line breaks in order for it to show correctly. I've also copied the file to a server if you want to preview what it should look like: http://www.lakecountyfl.gov/test.htm