<TBODY>, IE, and page-break

[matt]

hello,

ive been trying to figure something out, largely thru trial & error.
thought perhaps someone else may have knowledge.

i have an html table that consists of blocks of related data -- each
block contains three rows. this table is destined for paper printing. i
would like to tell the browser *not* to bust up my blocks. rather, i
would like it to smartly insert a page break inbetween <tbody>s if the
last one cannot be rendered entirely onto the remaining page area.

i have tried to accomplish this by styling the <tbody> w/
"page-break-before:auto;" -- hoping that it would automatically insert
a break before any <tbody> that cant fit on the page. sadly, this
doesnt work. im not sure what IE uses for its "auto" criteria, but it
doesnt appear to be "Does this element fit onto this page?"

ive also tried "page-break-after:auto", and both. no dice.

does any one have any other ideas?

thanks! and heres the html:


<table>
<thead>
<tr>
<th>header 1</th>
<th>header 2</th>
</tr>
<thead>
<tfoot>
<tr>
<td>footer 1</td>
<td>footer 2</td>
</tr>
<tfoot>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 1, row 1</td>
<td>block 1, row 2</td>
</tr>
<tbody>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 2, row 1</td>
<td>block 2, row 2</td>
</tr>
<tbody>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 3, row 1</td>
<td>block 3, row 2</td>
</tr>
<tbody>

</table>

 

[Jonathan N. Little]

hello,

ive been trying to figure something out, largely thru trial & error.
thought perhaps someone else may have knowledge.

i have an html table that consists of blocks of related data -- each
block contains three rows. this table is destined for paper printing. i
would like to tell the browser *not* to bust up my blocks. rather, i
would like it to smartly insert a page break inbetween <tbody>s if the
last one cannot be rendered entirely onto the remaining page area.

i have tried to accomplish this by styling the <tbody> w/
"page-break-before:auto;" -- hoping that it would automatically insert
a break before any <tbody> that cant fit on the page. sadly, this
doesnt work. im not sure what IE uses for its "auto" criteria, but it
doesnt appear to be "Does this element fit onto this page?"

ive also tried "page-break-after:auto", and both. no dice.

does any one have any other ideas?

thanks! and heres the html:


<table>
<thead>
<tr>
<th>header 1</th>
<th>header 2</th>
</tr>
<thead>
<tfoot>
<tr>
<td>footer 1</td>
<td>footer 2</td>
</tr>
<tfoot>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 1, row 1</td>
<td>block 1, row 2</td>
</tr>
<tbody>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 2, row 1</td>
<td>block 2, row 2</td>
</tr>
<tbody>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 3, row 1</td>
<td>block 3, row 2</td>
</tr>
<tbody>

</table>

Hard to say, if you used that markup is is so invalid...where to start.
Show a URL maybe your example here has typos (hopefully)

 

[Beauregard T. Shagnasty]

i have an html table that consists of blocks of related data -- each
block contains three rows. ...

<!-- dont break this block -->
<tbody>
<tr>
<td>block 1, row 1</td> <-- these would be *cell* 1
<td>block 1, row 2</td> <-- *cell* 2 ...
</tr>
<tr>
<td>block 2, row 1</td>
<td>block 2, row 2</td>
</tr>
<tr>
<td>block 3, row 1</td>
<td>block 3, row 2</td>
</tr>
<tbody>

A thought, but untested. Don't have any handy tables to produce this.

 

[matt]

Hard to say, if you used that markup is is so invalid...where to start.
Show a URL maybe your example here has typos (hopefully)

perhaps, i just typed that in manually into google's UI (my real table
has too many un-related details). that isnt the important part. whats
important, is the technique used to solve the problem.

as for the sample table, i thought it pretty basic: a <thead>, a
<tfoot>, and one or more <tbody>s.


matt

 

[matt]

beauregard,

that wouldnt achieve anything. the <TBODY> tagset can be used in my
op's fashion (multiple instances) as a means of organizing sets of rows
into blocks (presumably of related data). my intent is to then style
those blocks such that they dont split apart onto multiple pages.

if i kept *all* the <TR> rows under the same <TBODY> roof, i have no
smaller units, only the single tbody. that especially wont do, since i
have 300 rows in total (3 in each <TBODY> -- far more than can fit onto
one page.


matt

 

[Jonathan N. Little]

that wouldnt achieve anything. the <TBODY> tagset can be used in my
op's fashion (multiple instances) as a means of organizing sets of rows
into blocks (presumably of related data). my intent is to then style
those blocks such that they dont split apart onto multiple pages.

if i kept *all* the <TR> rows under the same <TBODY> roof, i have no
smaller units, only the single tbody. that especially wont do, since i
have 300 rows in total (3 in each <TBODY> -- far more than can fit onto
one page.

Well it might help if you close them, I assume you *meant* to, else you
have 2 TBODYs together with one being empty.


STYLE:

TBODY { page-break-inside: avoid; }

 

[matt]

Well it might help if you close them, I assume you *meant* to, else you
have 2 TBODYs together with one being empty.

yes, i did mean to.

TBODY { page-break-inside: avoid; }

i tried this, but it didnt work either -- at the bottom of a given
page, IE 6 still may render only two of the 3-row <tbody> rows, and
then span the third to the top of the next page.

im not even sure if it supports it, or if perhaps i need a certain doc
type, or what. currently im using:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >


thanks,
matt

 

[Beauregard T. Shagnasty]

beauregard,

that wouldnt achieve anything. the <TBODY> tagset can be used in my
op's fashion (multiple instances) as a means of organizing sets of
rows into blocks (presumably of related data). my intent is to then
style those blocks such that they dont split apart onto multiple
pages.

Waiddaminnit. You said you had data in blocks of three rows. Yet you

if i kept *all* the <TR> rows under the same <TBODY> roof, i have no
smaller units, only the single tbody. that especially wont do, since
i have 300 rows in total (3 in each <TBODY> -- far more than can fit
onto one page.

But that is not what you showed in your OP. You showed ONE row per
<tbody>.

Please don't top-post. Thanks.

 

[matt]

Waiddaminnit. You said you had data in blocks of three rows. Yet you
illustrated three _single_rows_, each in a separate <tbody>.

so i did. glaring omission; i was pretty burnt out working on it last
nite.

updated HTML, but the problem is still the same as described -- IE 6
(win) inserts breaks directly into the <TBODY>s, even while using the
previously mentioned page-break instructions. this is confusing to me.
im not sure if IE is failing to "avoid" doing page breaks on my
<TBODY>s because A) its not supported, or B) because my attempts havent
been correct. (i dont have the HTML typos in my actual markup. they are
more complex tables which i reduced to simpler examples in google's
textbox for posting [no newsgroups fun at my org], probably in too much
of a hurry).


<table>
<thead>
<tr>
<th>header 1</th>
<th>header 2</th>
</tr>
<tr>
<th>header 3</th>
<th>header 4</th>
</tr>
<tr>
<th>header 5</th>
<th>header 6</th>
</tr>
</thead>
<tfoot>
<tr>
<td>footer 1</td>
<td>footer 2</td>
</tr>
</tfoot>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 1, row 1, col 1</td>
<td>block 1, row 1, col 2</td>
</tr>
<tr>
<td>block 1, row 2, col 1</td>
<td>block 1, row 2, col 2</td>
</tr>
<tr>
<td>block 1, row 3, col 1</td>
<td>block 1, row 3, col 2</td>
</tr>
</tbody>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 2, row 1, col 1</td>
<td>block 2, row 1, col 2</td>
</tr>
<tr>
<td>block 2, row 2, col 1</td>
<td>block 2, row 2, col 2</td>
</tr>
<tr>
<td>block 2, row 3, col 1</td>
<td>block 2, row 3, col 2</td>
</tr>
</tbody>

<!-- dont break this block -->
<tbody>
<tr>
<td>block 3, row 1, col 1</td>
<td>block 3, row 1, col 2</td>
</tr>
<tr>
<td>block 3, row 2, col 1</td>
<td>block 3, row 2, col 2</td>
</tr>
<tr>
<td>block 3, row 3, col 1</td>
<td>block 3, row 3, col 2</td>
</tr>
</tbody>
</table>


thanks,
matt

 

[Beauregard T. Shagnasty]

Waiddaminnit. You said you had data in blocks of three rows. Yet you
illustrated three _single_rows_, each in a separate <tbody>.

so i did. glaring omission; i was pretty burnt out working on it last
nite.

updated HTML, but the problem is still the same as described -- IE 6
(win) inserts breaks directly into the <TBODY>s, even while using the
previously mentioned page-break instructions. this is confusing to
me. im not sure if IE is failing to "avoid" doing page breaks on my
<TBODY>s because A) its not supported, or B) because my attempts
havent been correct. (i dont have the HTML typos in my actual markup.
they are more complex tables which i reduced to simpler examples in
google's textbox for posting [no newsgroups fun at my org], probably
in too much of a hurry).

Tell us if this page I tossed together from your code - adding some text
to make it a meaningful length - is what you are attempting.

http://k75s.home.att.net/tbody.html

This works (page-break-after tbody) in Firefox, but not in IE or Opera.

 

[Jonathan N. Little]

Waiddaminnit. You said you had data in blocks of three rows. Yet you
illustrated three _single_rows_, each in a separate <tbody>.

so i did. glaring omission; i was pretty burnt out working on it last
nite.

updated HTML, but the problem is still the same as described -- IE 6
(win) inserts breaks directly into the <TBODY>s, even while using the
previously mentioned page-break instructions. this is confusing to
me. im not sure if IE is failing to "avoid" doing page breaks on my
<TBODY>s because A) its not supported, or B) because my attempts
havent been correct. (i dont have the HTML typos in my actual markup.
they are more complex tables which i reduced to simpler examples in
google's textbox for posting [no newsgroups fun at my org], probably
in too much of a hurry).

Tell us if this page I tossed together from your code - adding some text
to make it a meaningful length - is what you are attempting.

http://k75s.home.att.net/tbody.html

This works (page-break-after tbody) in Firefox, but not in IE or Opera.

The issue is with IE, so folks wonder why web developers b*tch about IE?

 

[matt]

Tell us if this page I tossed together from your code - adding some text
to make it a meaningful length - is what you are attempting.

sorta. that page uses "page-break-after:always" on each <TBODY>, giving
you one per page. that i can do. but the challenge is getting it to: 1)
render as many <TBODY>s on a page as fit, and 2) if one cannot fit
entirely, never chop it; instead insert a page-break and render it on
the next page.

the reason for this is, each <TBODY> is a block of related-data, so
paging right in the middle of one is ackward for the end-user. one
needs a way to fit as many whole elements as possible, always inserting
a new page when that cannot be done.

in theory, CSS2 should be able to do this by putting
"page-break-inside:avoid" and "page-break-before:auto" on the <TBODY>.
but that isnt working -- in IE *or* firefox for me (tho yes, i am
primarily concerned w/ IE on my intranet apps).

here is a modified version of your page. note that there are 3 <TBODY>
blocks. note that in firefox only 2 <TBODY>s can fit onto a single page
(in IE, only 1 can). note then how both browsers then split the
non-fitting <TBODY>, rather than inserting a new page as
desired/instructed....:

http://www.sushi-review.com/test/tbody2.html


matt

 

[matt]

The issue is with IE, so folks wonder why web developers b*tch about IE?

actually, the desired behavior is not working for me in either IE or
firefox. tho for no reason will i stop bitching about IE's failures


matt

 

[Jonathan N. Little]

here is a modified version of your page. note that there are 3 <TBODY>
blocks. note that in firefox only 2 <TBODY>s can fit onto a single page
(in IE, only 1 can). note then how both browsers then split the
non-fitting <TBODY>, rather than inserting a new page as
desired/instructed....:

http://www.sushi-review.com/test/tbody2.html

Don't know but works for me! SeaMonkey 1.0.5 (and Firefox 1.5.0.7) on
Win2k. I get 2 pages


header 1 header 2
header 3 header 4
header 5 header 6

block 1, row 1, col 1
block 1, row 1, col 2
block 1, row 2, col 1
block 1, row 2, col 2
block 1, row 3, col 1
block 1, row 3, col 2
block 2, row 1, col 1
block 2, row 1, col 2
block 2, row 2, col 1
block 2, row 2, col 2
block 2, row 3, col 1
block 2, row 3, col 2

footer 1 footer 2

[pagebreak]

header 1 header 2
header 3 header 4
header 5 header 6

block 3, row 1, col 1
block 3, row 1, col 2
block 3, row 2, col 1
block 3, row 2, col 2
block 3, row 3, col 1
block 3, row 3, col 2

footer 1 footer 2


Which looks like is should. IE does even repeat the table headers and
footers...lost cause. Gee you might have to recommend Firefox for your
intranet! ;=)

 

[matt]

Don't know but works for me! SeaMonkey 1.0.5 (and Firefox 1.5.0.7) on
Win2k. I get 2 pages

that is odd. i wonder why it doesnt on my firefox. same version, w2k.

Which looks like is should. IE does even repeat the table headers and
footers...lost cause.

yeah, in IE one has to manually add the thead & tfoot print/page
"display" definitions.

but the fact that IE *doesnt* do the page insertion correctly is why i
began this thread. im hoping someone else may have a working technique,
workaround, doctype, etc..

Gee you might have to recommend Firefox for your
intranet! ;=)

sadly, this is not possible.


matt

 

[Jonathan N. Little]

that is odd. i wonder why it doesnt on my firefox. same version, w2k.


yeah, in IE one has to manually add the thead & tfoot print/page
"display" definitions.

but the fact that IE *doesnt* do the page insertion correctly is why i
began this thread. im hoping someone else may have a working technique,
workaround, doctype, etc..

Sorry to poke a little fun here but your boned. As I said you can see
why web developers complain about IE. Much easier writing for a modern
browser. Bad news even when MS gets around to releasing a "modern"
browser it is still going to be "old at heart" and not much better

sadly, this is not possible.

Yeah, I here yah. Damn Intranet applications that require all that
insecurity to allow direct access to the client's OS to function! We
since you are stuck with the MS anchor for your life-preserver why not
generate the table as an Excel spreadsheet and be done with it! There
are even Pear packages for doing this and I am sure MS as some ActiveX
doohickey and bypass IE CSS shortcomings all together.

 

[matt]

why not generate the table as an Excel spreadsheet and be done with it!

something ive looked into a little bit as well. im not as familar w/
excel layout, but i do know how to work w/i the confines of html. for
instance the real-world versions have these tables have about 35 column
headers divided into 3 rows of headers. w/ so much data, the headers &
footers must print on every page. each "row" of report data is actually
3 rows (about 35 pieces of information), thus the <TBODY>s. some of the
row column need certain widths, others we do not care about and want to
stretch out (the table is 100% wide; i dont always know what size paper
it will be printed on, legal or tabloid, but want it to stretch). some
reports have a row that spans all 35 columns and has instead a nested
sub-table of related information.

getting this all to look mildly attractive in the printed form has been
a challenge. but one myself & CSS can deal with. except for this
annoying IE <TBODY>-split bug.


thanks,
matt






There