Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 926
  • Last Modified:

HTML page breaks

Is there a way to put something like page breaks into a table in HTML so that when the user prints the page, rows are not split between 2 pages?  I am not at all familiar with JavaScript but am willing to learn it if necessary.
0
LBugbee
Asked:
LBugbee
1 Solution
 
php-webdesignCommented:
0
 
bameCommented:
Instead of telling the browser where to break, you can tell the browser NOT to put page breaks in rows by setting the "page-break-inside" CSS property to "avoid".

<table>
<tr style="page-break-inside: avoid">
<td>...</td>
</tr>
</table>

If you really do want to force page breaks, take a look at page-break-after and page-break-before.

For details: http://www.w3schools.com/css/css_ref_print.asp

Note: Mozilla-based browsers (like Netscape) don't support this yet. See https://bugzilla.mozilla.org/show_bug.cgi?id=132035
0
 
COBOLdinosaurCommented:
If you are printing a table, it is very like to get screwed up will some setting no matter what you do.  If there are nested tables then the chances of success are somewhere a little less than zero.  If the printing is critical, then use a pdf or other print friend file type; or develop a printer friendly stylesheet that does a rendering without the tables.

Cd&
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
minichickenCommented:
This is what I use to do page breaks for printing pages
use style="page-break-before:always" in your table tag

Example:

<table style="page-break-before:always" width="100%"  border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>

j311y :)
0
 
RoonaanCommented:
As to what minichicken says, better assign that style to your tr's because ;-)

<style type="text/css">
 table.unbreakablerows tr {page-break-before:always;}
</style>

<table class="unbreakablerows">
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
<tr><td>Data<br/>Data<br/>Data<br/>Data<br/>Data<br/>Data</td></tr>
</table>

-r-
0
 
LBugbeeAuthor Commented:
Bame's suggested "page-break-inside: avoid" sounds like what I'm looking for but it didn't work. (IE6) I don't want a new page everytime I start this row, only if it's going to overflow to the next page.
0
 
RoonaanCommented:
Use page-break-inside:avoid;

or page-break-before:auto;

See also: http://www.w3schools.com/css/css_ref_print.asp
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now