Emulate paging in an HTML document.

[Rithish]

I want to emulate paging in an HTML document. something like,

-------------------------
| |
| <DIV> |
| |
| <TABLE></TABLE> |
| |
| <TABLE></TABLE> |
| |
| </DIV> |
| |
| <DIV PAGEBREAK> |
| |
| <DIV> |
| |
| <TABLE></TABLE> |
| |
| <TABLE></TABLE> |
| |
| </DIV> |
| |
| |
| |

The DIVs( <DIV STYLE="width:'1 00%';position:r elative;"> ) are
positioned relative to the body, and the TABLEs ( <TABLE
STYLE="width:'8 0%';position:ab solute;left:'0P X';top:'0PX';"> ) are
positioned absolute to the DIVs.

Thus, when I print preview the document, I get two tables in each
page; however, in the display, the tables that are supposed to be in
the second page page overlap the ones that are in the first page. I
guess the reason is 'cos the DIVs' height will not consist of the sum
of the height of the child <TABLE> elements that are in it. ( I put a
border around the DIV and confirmed this. It takes only one
glyph/px/whatever.. )

Is it possible to acheive what I want to?? I dont know...

I would greatly appreciate any help.
Regards,
Rithish.

[John Bokma]

Rithish wrote:

Is it possible to acheive what I want to?? I dont know...

Isn't there a CSS thing to force page breaks?

--
John MexIT: http://johnbokma.com/mexit/
personal page: http://johnbokma.com/
Experienced Perl programmer available: http://castleamber.com/

[Neal]

On 11 May 2004 07:32:09 -0700, Rithish <ri*****@dacafe .com> wrote:

I want to emulate paging in an HTML document.
To me, this is sort of like emulating sore, tired legs and feet in an
automobile, but I'll play ball.
The DIVs( <DIV STYLE="width:'1 00%';position:r elative;"> ) are
positioned relative to the body, and the TABLEs ( <TABLE
STYLE="width:'8 0%';position:ab solute;left:'0P X';top:'0PX';"> ) are
positioned absolute to the DIVs.

Thus, when I print preview the document, I get two tables in each
page; however, in the display, the tables that are supposed to be in
the second page page overlap the ones that are in the first page. I
guess the reason is 'cos the DIVs' height will not consist of the sum
of the height of the child <TABLE> elements that are in it. ( I put a
border around the DIV and confirmed this. It takes only one
glyph/px/whatever.. )

What your issue is, I'm not entirely sure. Have you read
http://www.w3.org/TR/CSS2/page.html#page-breaks ? If so, is your issue
that the page break is not working? I don't know much about this aspect of
CSS, perhaps there are support issues.

Is your div containing the tables as you desire, or not? I'm really not
clear on that.

Please create a live example and post a URL so what you're asking can be
more lucent.

[Alan J. Flavell]

On Tue, 11 May 2004, John Bokma wrote:

Isn't there a CSS thing to force
CSS never "forces" anything. It only makes proposals, which the
client agent can action or not as it sees fit. That's an important
principle, not just a form of words.
page breaks?

Not those either.

[Brian]

John Bokma wrote:

Isn't there a CSS thing to force page breaks?

[bearing in mind A.Flavell's comments about "force" and css]

AFAIK, css pagination support is extremely poor. I think only Opera has
made even an attempt to support it, and it has not succeeded. You might
learn more by Googling for Mozilla css @page and Opera css @page. (Don't
bother with MSIE!)

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/

[John Bokma]

Brian wrote:

John Bokma wrote:

Isn't there a CSS thing to force page breaks?

[bearing in mind A.Flavell's comments about "force" and css]

Indeed, should have written "suggest" or "kindly request" not force.

--
John MexIT: http://johnbokma.com/mexit/
personal page: http://johnbokma.com/
Experienced Perl programmer available: http://castleamber.com/

[Eric Bustad]

Brian wrote:

John Bokma wrote:

Isn't there a CSS thing to force page breaks?

[bearing in mind A.Flavell's comments about "force" and css]

AFAIK, css pagination support is extremely poor. I think only Opera has
made even an attempt to support it, and it has not succeeded. You might
learn more by Googling for Mozilla css @page and Opera css @page. (Don't
bother with MSIE!)

<div style="page-break-before: always;"> seems to work in Mozilla.

= Eric

[Alan J. Flavell]

On Tue, 11 May 2004, Alan J. Flavell wrote:

CSS never "forces" anything. It only makes proposals, which the
client agent can action or not as it sees fit. That's an important
principle, not just a form of words.

page breaks?

Not those either.

My apologies: I hadn't meant to be so brusque at the end. But as
others have already noted, browser support for this is still quite
poor, and I can't offer you anything more positive, I'm afraid.

[Rithish]

> What your issue is, I'm not entirely sure.

Pardon me for not stating my issue clearly... I am yet a novice.. :D
My issue is not breaking of pages... CSS style 'Page-break' works
fine. The issue is the display of these elements as contiguous.

Is your div containing the tables as you desire, or not? I'm really not
clear on that.

Please create a live example and post a URL so what you're asking can be
more lucent.

I am sorry that I will be unable to post a URL... However, I will try
to explain with an example...

I will take a scenario wherein I want to have two tables in two pages
of the document. The first table/s will be 48px from the top of the
page, and the second would be 96px from the top of the page. Hence, if
I do a print of the document, I will effectively get two pages, with
two tables each in them, like this,

Page 1
--------------------
| |
| <Table at 48px> |
| |
| |
| <Table at 96px> |
| |
--------------------

Page 2
--------------------
| |
| <Table at 48px> |
| |
| |
| <Table at 96px> |
| |
--------------------

However, when the html document is viewed(display) , the tables overlap
each other.. I mean, the tables of the second page, write over the
tables in the first page. I know this is 'cos of the CSS absolute
positioning of elements.
I believed the DIV to bloat up to accomodate the TABLEs specified in
it. Hence, when the next DIV is relatively positioned to the previous,
four tables could be viewed, one below the other... This is my
requirement...

The code snippet for this is as below,

<DIV STYLE="width:'1 00%';position:r elative;BORDER-TOP:'1PX SOLID
BLUE';BORDER-LEFT:'1PX SOLID BLUE';BORDER-RIGHT:'1PX SOLID
BLUE';BORDER-BOTTOM:'1PX SOLID BLUE';">

<TABLE HEIGHT="48PX" STYLE="width:'8 0%';BORDER-TOP:'1PX SOLID
BLACK';BORDER-LEFT:'1PX SOLID BLACK';BORDER-RIGHT:'1PX SOLID
BLACK';BORDER-BOTTOM:'1PX SOLID
BLACK';position :absolute;left: '0PX';top:'0PX' ;">
<TR>
<TD ALIGN=CENTER VALIGN=MIDDLE>T est1</TD>
</TR>
</TABLE>

<TABLE HEIGHT="48PX" STYLE="width:'6 0%';BORDER-TOP:'1PX SOLID
BLACK';BORDER-LEFT:'1PX SOLID BLACK';BORDER-RIGHT:'1PX SOLID
BLACK';BORDER-BOTTOM:'1PX SOLID
BLACK';position :absolute;left: '0PX';top:'96PX ';">
<TR>
<TD ALIGN=CENTER VALIGN=MIDDLE>T est2</TD>
</TR>
</TABLE>

</DIV>
<DIV STYLE="PAGE-BREAK-AFTER:always;po sition:relative ;"></DIV>
<DIV STYLE="width:'1 00%';position:r elative; BORDER-TOP:1PX SOLID RED;
BORDER-LEFT:1PX SOLID RED; BORDER-RIGHT:1PX SOLID RED;
BORDER-BOTTOM:1PX SOLID RED;">

<TABLE HEIGHT="48PX" STYLE="width:'8 0%';BORDER-TOP:'1PX SOLID
BLACK';BORDER-LEFT:'1PX SOLID BLACK';BORDER-RIGHT:'1PX SOLID
BLACK';BORDER-BOTTOM:'1PX SOLID
BLACK';position :absolute;left: '0PX';top:'0PX' ;">
<TR>
<TD ALIGN=CENTER VALIGN=MIDDLE>T est3</TD>
</TR>
</TABLE>

<TABLE HEIGHT="48PX" STYLE="width:'6 0%';BORDER-TOP:'1PX SOLID
BLACK';BORDER-LEFT:'1PX SOLID BLACK';BORDER-RIGHT:'1PX SOLID
BLACK';BORDER-BOTTOM:'1PX SOLID
BLACK';position :absolute;left: '0PX';top:'96PX ';">
<TR>
<TD ALIGN=CENTER VALIGN=MIDDLE>T est4</TD>
</TR>
</TABLE>

</DIV>

You will note that the tables are encompassed and absolutely
positioned inside and wrt a DIV. Thus each DIV would emulate a page...

This is the best my vocabulary can do... I hope I have stated my
point.. I greatly appreciate your help folks...

Regards,
Rithish.

[Wolfgang Wildeblood]

ri*****@dacafe. com (Rithish) wrote:

My issue is not breaking of pages... CSS style 'Page-break' works
fine. The issue is the display of these elements as contiguous. I will take a scenario wherein I want to have two tables in two pages
of the document. The first table/s will be 48px from the top of the
page, and the second would be 96px from the top of the page. Hence, if
I do a print of the document, I will effectively get two pages, with
two tables each in them, like this,

Page 1
--------------------
| |
| <Table at 48px> |
| |
| |
| <Table at 96px> |
| |
--------------------

Page 2
--------------------
| |
| <Table at 48px> |
| |
| |
| <Table at 96px> |
| |
--------------------

However, when the html document is viewed(display) , the tables overlap
each other.. I mean, the tables of the second page, write over the
tables in the first page. I know this is 'cos of the CSS absolute
positioning of elements.
You're obviously trying to achieve something a bit trickier than this
though, or you wouldn't need positioning at all.

I believed the DIV to bloat up to accomodate the TABLEs specified in
it. Hence, when the next DIV is relatively positioned to the previous,
four tables could be viewed, one below the other... This is my
requirement.

To get what you're describing, just leave all the positioning out,
except the page-break between table 2 and table 3. So what are you
really after?