Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML: IE9 standards mode print TFOOT on every page

Tables in HTML can have "footers":

<TABLE>
   <THEAD><TR><TD>Your header goes here</TD></TR></THEAD>
   <TFOOT><TR><TD>Your footer goes here</TD></TR></TFOOT>
   <TBODY>
      <TR><TD>
         Page body in here -- as long as it needs to be
     </TD></TR>
   </TBODY>
</TABLE>

Normally, legacy Internet Explorer would only display the TFOOT at the bottom of the entire table. But there was a style that can be applied to TFOOT (and THEAD) to make it print at the bottom of each page spanned by the table. From MSDN:

table-footer-group
Object is rendered as tFoot. Table footer is always displayed
after all other rows and row groups, and before any bottom captions.
The footer is displayed on each page spanned by a table.

Adding table-footer-group as a style to TFOOT causes it (in Internet Explorer) to print at the bottom of each page spanned by the table:

<STYLE type="text/css">
   tfoot { display: table-footer-group; }
</STYLE>

But if IE9 (release candidate) is placed into standards mode:

<!DOCTYPE html>

then the TFOOT is no longer rendered at the bottom of every page spanning the table, but only at the end of the entire table.

i checked the HTML spec to see what the proper behavior is, and it's undefined!:

table-footer-group (In HTML: TFOOT)
Like 'table-row-group', but for visual formatting, the row group is always displayed after all other rows and row groups and before any bottom captions. Print user agents may repeat footer rows on each page spanned by a table. If a table contains multiple elements with 'display: table-footer-group', only the first is rendered as a footer; the others are treated as if they had 'display: table-row-group'.

Note: Emphasis added for effect.

Is there a way in IE9 standards mode for me to choose to print a TFOOT at the bottom of each page spanned by a table?

Update One

It is interesting to note that table-footer-group is a typical default value for TFOOT elements, but in previous versions of IE you could choose which behavior you wanted:

  • bottom of entire table
  • bottom of entire table and every intermediate page

by choosing to include the style.

Update Two

As it is now i am forcing Internet Explorer to remain in IE8 standards mode with:

<!DOCTYPE html>
<HTML>
<HEAD>
   <META http-equiv="X-UA-Compatible" content="IE=8" />
   <!--IE8 Standards mode, so that we get the THEAD at the top, and the TFOOT at the bottom, of every page-->

See also

  • Is there a way to get a web page header/footer printed on every page?
  • MSDN: display Attribute
  • W3C CSS2.1: 17.2 The CSS table model
  • Printer Friendly Pages With a Header on Every Page?
  • table-header-group and table-footer-group in a Div
like image 742
Ian Boyd Avatar asked Mar 09 '11 21:03

Ian Boyd


1 Answers

In HTML the behavior was undefined. Browsers could:

  • display after the entire table
  • display at the bottom of each page.

The behavior i was experiencing was in Internet Explorer 9 Release Candidate.

In the final version of Internet Explorer 9 (Version 9.0.8112.1642 RTM) the TFOOT appears at the bottom of every printed page, all the time.

In earlier versions of IE you could choose between:

  • TFOOT appearing at the bottom of every page
  • TFOOT appearing after the table

by manually specifying the TFOOT css style:

tfoot { display: table-footer-group; }

Even though tfoot already has the display style of table-footer-group, specifically including it would tell IE you want the TFOOT printed at the bottom of every page. (rather than after the table).

Not specifying it (the default behavior) will make IE print the TFOOT after the entire table.

If you are using IE9, and want to only have a TFOOT appear after the whole table has printed, you will have to put Internet Explorer into IE8 standards mode:

<!DOCTYPE html>
<HTML>
<HEAD>
   <META http-equiv="X-UA-Compatible" content="IE=8" />
   <!--IE8 Standards mode, so that we get the TFOOT after the entire table has printed, not at the bottom of each printed page-->
   ...
like image 89
Ian Boyd Avatar answered Nov 15 '22 03:11

Ian Boyd