Printer header on every page using page breaks

I am trying to print all of my tables on seperate pages. I have successfully done so, but t he issue I am running into is that I have a <thead> table and I need that to print at the top of everypage. I also want to combine the first table with the thead so the <thead> and 1st table print on the first page and then the rest of the tables print on seperate pages..The CSS I am using is below..
table.repeat {
	border-spacing: 2px;
	border: 2pt solid black;
	border-collapse: collapse;
	page-break-before: always;
	page-break-inside: avoid;


Open in new window

Who is Participating?
Michel PlungjanConnect With a Mentor IT ExpertCommented:
Or convert to PDF
Hi Brad,

First of all, if you need a thead for every table then add it to every table in your html. If there's certain tables you don't want to display the thead for on screen add a stylesheet for @media(screen) and specifically hide the thead from the screen. Or alternatively hide the thead, but add a stylesheet for @media(print) and unhide it :)

As for printing the tables each on their own separate page, this'll be hard, if not impossible since most browsers don't honor the specific page-related style-rules.

You may have some degree of success by putting the tables in a wrapper div and setting the div to height 100% and overflow visible for @media(print) only, no guarantees, but it's the only trick I can think of that may have some degree of success....


All Courses

From novice to tech pro — start learning today.