repeat header element when printing

G

GF

Hi,

I want a <div> and it's content to overlay each page that I print. So far, I
get a few texts repeated and the correct overlay only on the last page.

I need some code that works on IE8. If it worked on Webkit, even better, but
IE8 is a must.


The complete code is here:
http://www.glbasic.com/beta/wdkem.html

Some image about what I need:
http://www.glbasic.com/pix/print_preview_overlay.png


Here's my code (important parts)

#CSS
..ztvk thead {display: table-header-group;}
..headspace{width:80%; height: 2.7cm; border: 3px solid red;}
..overlay {position: fixed; left:0px; top:0px; width:17.0cm; height:22.0cm;
border: 5px solid blue; overflow:visible; z-index:100;}

#HTML
<...>
<table>
<thead class='ztvk'>
<tr><td class='headspace'>

<!-- this is the overlay container -->
<div class='overlay'>

<!-- a box -->
<div style='position:absolute; left:0.00cm; top:0.00cm; width:17.00cm;
height:22.00cm; z-index:102'>&nbsp;</div>

<!-- some text -->
<div style='position:absolute; left:0.5cm; top:0.25cm; height:0.50cm;
padding:0.01cm; margin:0.01cm; line-height:0.50cm;
z-index:101;'><b>TEXT</b></div>
</div>
</td></tr></thead>

<tbody><tr><td class='maintext'>
text goes here...
 
1

123Jim

Hi,

I want a <div> and it's content to overlay each page that I print. So
far, I get a few texts repeated and the correct overlay only on the last
page.

I need some code that works on IE8. If it worked on Webkit, even better,
but IE8 is a must.


The complete code is here:
http://www.glbasic.com/beta/wdkem.html

Some image about what I need:
http://www.glbasic.com/pix/print_preview_overlay.png


Here's my code (important parts)

#CSS
.ztvk thead {display: table-header-group;}
.headspace{width:80%; height: 2.7cm; border: 3px solid red;}
.overlay {position: fixed; left:0px; top:0px; width:17.0cm;
height:22.0cm; border: 5px solid blue; overflow:visible; z-index:100;}

#HTML
<...>
<table>
<thead class='ztvk'>
<tr><td class='headspace'>

<!-- this is the overlay container -->
<div class='overlay'>

<!-- a box -->
<div style='position:absolute; left:0.00cm; top:0.00cm; width:17.00cm;
height:22.00cm; z-index:102'>&nbsp;</div>

<!-- some text -->
<div style='position:absolute; left:0.5cm; top:0.25cm; height:0.50cm;
padding:0.01cm; margin:0.01cm; line-height:0.50cm;
z-index:101;'><b>TEXT</b></div>
</div>
</td></tr></thead>

<tbody><tr><td class='maintext'>
text goes here...

In firefox I see a header at the top of each page when I check print
preview, but checking print preview seems to choke IE9 for your page.
Not sure what you are trying to achieve really
but maybe this will help: http://www.alistapart.com/articles/goingtoprint/
 

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

Members online

Forum statistics

Threads
473,995
Messages
2,570,226
Members
46,815
Latest member
treekmostly22

Latest Threads

Top