Print and Print Preview problem

B

Benjamin Farrow

I have a weird behavior occuring in IE 6.0 and I'm not sure if this is the
appropriate group (please point me to a better one, I'm running into a brick
wall with other CSS groups). I am trying to use HTML
to display documents to a user. I want the rendered version in the browser
to look the same as the print preview (I know probably not the best
way to do it). If I have multiple pages, everything works just fine.
For some reason that I can't figure out, when I only have a single
page, IE when it goes to print (print preview included), will add a
second blank page, regardless of what I do. Below is a sample of what
I'm trying to accomplish...any help or pointers would greatly be
appreciated.
My JScript is there to deal with a margin issue, I want the margin to appear
in the render, but ensure that I adjust for the default margin settings
(.75in) when printing.
Thanks a million,
Benjamin

<html>
<head>
<script language="JScript">
<!--
function adjustPrint(){
var pgs = document.all.stuff;
for (i=0;i<pgs.length;i++) {
pgs.style.height = "9.5in";
pgs.style.top = (pgs.number-1)*9.5 + 'in';
}
}
function adjustPrintBack(){
var pgs = document.all.stuff;
for (i=0;i<pgs.length;i++) {
pgs.style.height = "11in";
pgs.style.top = (pgs.number-1)*11 + 'in';
}
}
window.onbeforeprint=adjustPrint;
window.onafterprint=adjustPrintBack;
-->
</script>
<style type="text/css">
div.page {
position: absolute;
font-family: times;
font-size: 12pt;
margin: 0in;
border: dashed blue 0.5pt;
clip: rect(0,8.5in,11in,0);
}
div.CA {
position: absolute;
border: dashed black 0.5pt;
background-color: white;
}
@media print {
div.page {
margin: -0.75in;
page-break-after: always;
border: none;
}
div.CA {
border: none;
}
}
</style>
<title>Page Test</title>
</head>
<body>
<div id="stuff" class="page" number="1"
style="top:0in;left:0in;width:8.5in;height:11in;">
<div class="CA"
style="top:4.729in;left:.76in;width:6.948in;height:.563in;overflow:hidden;">
Some
Text at a specified location.</div>
</div>
<!-- add this page div back in to see that only two pages are
printed -->
<!--
<div id="stuff" class="page" number="2"
style="top:11in;left:0in;width:8.5in;height:11in;">
<div class="CA"
style="top:4.729in;left:.76in;width:6.948in;height:.563in;overflow:hidden;">
Some
Text at a specified location.</div>
</div>
-->
</body>
</html>
 
B

Benjamin Farrow

Sorry, I believe I've posted this to the wrong group. I believe I have
found a more appropriate group
(microsoft.public.inetsdk.programming.scripting.jscript) to post this to.
However, if you have anything to say about this issue, please see my message
in the other group and respond, I'm desperately trying to find a work
around.

Thanks,
Benjamin

Benjamin Farrow said:
I have a weird behavior occuring in IE 6.0 and I'm not sure if this is the
appropriate group (please point me to a better one, I'm running into a brick
wall with other CSS groups). I am trying to use HTML
to display documents to a user. I want the rendered version in the browser
to look the same as the print preview (I know probably not the best
way to do it). If I have multiple pages, everything works just fine.
For some reason that I can't figure out, when I only have a single
page, IE when it goes to print (print preview included), will add a
second blank page, regardless of what I do. Below is a sample of what
I'm trying to accomplish...any help or pointers would greatly be
appreciated.
My JScript is there to deal with a margin issue, I want the margin to appear
in the render, but ensure that I adjust for the default margin settings
(.75in) when printing.
Thanks a million,
Benjamin

<html>
<head>
<script language="JScript">
<!--
function adjustPrint(){
var pgs = document.all.stuff;
for (i=0;i<pgs.length;i++) {
pgs.style.height = "9.5in";
pgs.style.top = (pgs.number-1)*9.5 + 'in';
}
}
function adjustPrintBack(){
var pgs = document.all.stuff;
for (i=0;i<pgs.length;i++) {
pgs.style.height = "11in";
pgs.style.top = (pgs.number-1)*11 + 'in';
}
}
window.onbeforeprint=adjustPrint;
window.onafterprint=adjustPrintBack;
-->
</script>
<style type="text/css">
div.page {
position: absolute;
font-family: times;
font-size: 12pt;
margin: 0in;
border: dashed blue 0.5pt;
clip: rect(0,8.5in,11in,0);
}
div.CA {
position: absolute;
border: dashed black 0.5pt;
background-color: white;
}
@media print {
div.page {
margin: -0.75in;
page-break-after: always;
border: none;
}
div.CA {
border: none;
}
}
</style>
<title>Page Test</title>
</head>
<body>
<div id="stuff" class="page" number="1"
style="top:0in;left:0in;width:8.5in;height:11in;">
<div class="CA"
style="top:4.729in;left:.76in;width:6.948in;height:.563in;overflow:hidden;">
Some
Text at a specified location.</div>
</div>
<!-- add this page div back in to see that only two pages are
printed -->
<!--
<div id="stuff" class="page" number="2"
style="top:11in;left:0in;width:8.5in;height:11in;">
<div class="CA"
style="top:4.729in;left:.76in;width:6.948in;height:.563in;overflow:hidden;">
Some
Text at a specified location.</div>
</div>
-->
</body>
</html>
Click to expand...
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

print templates not working 1
Fails then continues without error 6
another IE8, firefox markup problem 3
Font color on received messages 1
generating word document with header and footerwithout using word object. 0
problem with master page and firefox 5
CSS problem in Firefox 4
Page Title not Editable using DWT 3

Top