Extraneous Page Break Inserted When Printing a Form with IE

[Jim Weinberg]

I have a form that I need to print on one page. Here's my current CSS:



@media all {
.page-break { display: none; }
}

@media print {
div#formcontainer {display: block;}
form {width: 100%; font-size-adjust: .4;}
textarea {width: 98%;}
body {background-color: #ffffff; zoom:67%;}
a {color: #000000;}
.page-break { display: block; page-break-before: always; }
.address {width: 92%}
}


This works in every browser I've tried, except IE (currently running IE 11, but need it to work in earlier versions).

Before you say it, I know Zoom is obsolete, but it makes the form print correctly in the other browsers.

In IE, the Zoom shrinks the form so it fits on one page width wise, but it inserts a page break where it would normally put it if I didn't use the Zoom. I also loose the centering of the text at the top.

I'm doing this for a government contract, so before you ask, I can't post a link to the actual form. However, I've put a "test page" together which will give you an idea of what's happening. The link http://ohiobuttons.org/test/FormTest.html

One note: The test page prints an extra, blank page at the end. That's not a problem, as the real form page doesn't.

I've tried using height and page-break-inside: avoid parameters, but no luck.

Any help in solving this problem would be greatly appreciated.

[Jim Weinberg]

Well, no suggestions, so I went through and cleaned up my css code and the problem went away. Not sure which css constructs was causing the problem or why it no longer exists, but it works so I'm happy. This thread should be closed.