I am having a problem with a page because its longer than one page it break a table so it would be printed in two pages.
I would need to stop this from happening, but I don’t know how.
I tried
table { page-break-inside:auto }
tr { page-break-inside:avoid; page-break-after:auto }
Which I saw in another question here but no luck so far.
I am working on IE7, but it has to work on IE6,IE7,IE8 mainly and others if possible.
Any recommendations?
Many thanks.
CSS
/*Universal selector:
This rule set will be applied to every element in a document:*/
*
{
margin:auto;
padding:auto;
/*text-align:center;*/
font-size:1em;
}
/*The folowing rule will help to minimaze the differences between browesers*/
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-weight:normal; font-style:normal;}
ul,ol {list-style:none;}
img {border:none;}
caption,th {text-align:left;}
table {
border-spacing:0;
font-size:1em;
font-weight:normal;
font-style:normal;
font-family:Times New Roman;
page-break-inside:avoid;
}
tr{
page-break-inside:avoid;
page-break-after:auto
}
.divTitle{
margin:10px;
}
}
.title
{
font-weight:bold;
color:#0076BF;
font-size:1.4em;
font-family:Times New Roman;
}
.divContainer
{
margin:10px;
background-color:#C7D8EE;
border:2px solid #0076BF;
text-align:left;
overflow:visible;
}
.tableContainer
{
color:#0076BF;
margin: -10px 0px -10px 0px;
border-spacing: 10px;
empty-cells:show;
width:90%;
}
.tableContainer tr td{
white-space:nowrap;
}
.tableContainerRow2{
background-color:white;
border:2px solid #0076BF;
}
.divBlueBarTitle{
margin:15px 10px -7px 10px;
background-color:#0076BF;
}
.divBlueBarTitle font{
font-size:1.2em;
font-family:Times New Roman;
font-weight:bold;
color:white;
text-indent:10px;
}
.divContainerWhite
{
margin:15px 10px 0px 10px;
background-color:white;
text-align:left;
}
.tableContainerWhite
{
color:#0076BF;
margin: 0px 0px 0px -10px;
border-spacing: 10px;
width:90%;
}
.tableContainerWhite td{
white-space:nowrap;
}
.footer {
margin-top:40px;
padding-bottom:20px;
font-family: Arial, Helvetica, sans-serif;
color: #303030;
line-height: normal;
font-size:smaller;
text-align:right;
width:95%;
}
HTML
<body>
<div class="divTitle">
<font class="title"> Maternity Diary Event</font>
</div>
<!--Maternity Diary Event-->
<div class="divContainer">
<table class="tableContainer" cellspacing="10px">
<tr>
<td>NHS Number</td>
<td> </td>
<td>Date of Visit</td>
<td> </td>
<td colspan="3">Care Time Started</td>
<td> </td>
<td> </td>
<td rowspan="2" style="font-weight:bold;vertical-align:middle;">Tick when<br/> care starts</td>
</tr>
<tr >
<td width="90" class="tableContainerRow2"> 
<xsl:value-of select="//MaternityDiaryEvent/NHSNumber"/>
</td>
<td > </td>
<td width="80" class="tableContainerRow2"> 12/12/09</td>
<td > </td>
<td width="40" class="tableContainerRow2"> 12</td>
<td width="5">:</td>
<td width="40" class="tableContainerRow2"> 10</td>
<td > </td>
<td style="text-align:right" > ☑</td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px" >
<tr>
<td></td>
<td>Initials</td>
<td>Surname</td>
</tr>
<tr>
<td width="80" style="font-weight:bold;">Midwife</td>
<td width="50" class="tableContainerRow2"> </td>
<td class="tableContainerRow2"> </td>
</tr>
<tr>
<td></td>
<td>Initials</td>
<td>Surname</td>
</tr>
<tr>
<td style="font-weight:bold;">Doctor</td>
<td class="tableContainerRow2"> </td>
<td class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px" >
<tr>
<td width="250">Forename</td>
<td>Surname</td>
</tr>
<tr>
<td class="tableContainerRow2"> </td>
<td class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px" style="margin-bottom:10px;" >
<tr>
<td width="90">Date of Birth</td>
<td width="150"></td>
<td width="100">Casenote No:</td>
<td></td>
</tr>
<tr>
<td class="tableContainerRow2"> </td>
<td></td>
<td class="tableContainerRow2"> </td>
<td></td>
</tr>
</table>
</div>
<!--Site Visit-->
<div class="divBlueBarTitle">
<font>SITE VISIT</font>
</div>
<div class="divContainer">
<table class="tableContainer" cellspacing="10px" style="margin-bottom:10px;">
<tr>
<td>Home</td>
<td> ☑</td>
<td>Blake Maty Centre</td>
<td> ☑</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Consultant ANC</td>
<td> ☑</td>
<td>Grange Maty Centre</td>
<td> ☑</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Midwifery ANC</td>
<td> ☑</td>
<td>MRMC/B5</td>
<td> ☑</td>
<td></td>
<td></td>
</tr>
<tr>
<td>Day assessment Unit</td>
<td> ☑</td>
<td>Ports Maty Centre SMH</td>
<td> ☑</td>
<td></td>
<td></td>
</tr>
<tr>
<td>Labour Ward</td>
<td> ☑</td>
<td>Posnatal Ward</td>
<td> ☑</td>
<td></td>
<td></td>
</tr>
<tr>
<td>Antenatal Ward</td>
<td> ☑</td>
<td>Telephone Assessment</td>
<td> ☑</td>
<td>Other(give reason below)</td>
<td> ☑</td>
</tr>
<tr>
<td class="tableContainerRow2" colspan="6" rowspan="2"> </td>
</tr>
</table>
</div>
<div class="divContainerWhite">
<table class="tableContainerWhite" cellspacing="10px" style="font-size:1.1em;">
<tr>
<td style="text-decoration:underline;font-weight:bold;white-space:nowrap;">Reason for Contact Booking:</td>
<td> </td>
<td width="150" style="font-weight:bold;">Gestation: Weeks:</td>
<td width="30" class="tableContainerRow2"> </td>
<td width="50" style="font-weight:bold;">Days:</td>
<td width="30" class="tableContainerRow2"> </td>
<td > </td>
</tr>
</table>
<table class="tableContainerWhite" cellspacing="10px">
<tr>
<td >Choice of Birth Offered</td>
<td> ☑</td>
<td >Domestic Violence Identified</td>
<td> ☑</td>
<td >Late Booker (> 11Wks 6 Days)</td>
<td> ☑</td>
</tr>
<tr>
<td style="white-space:nowrap">Contact Number Provided</td>
<td> ☑</td>
<td style="white-space:nowrap">Safeguarding Children identified</td>
<td> ☑</td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
<div class="divContainer">
<table class="tableContainer" cellspacing="10px">
<tr>
<td colspan="4" style="font-size:1.1em;text-decoration:underline;font-weight:bold;">Reason For Late Booking</td>
</tr>
<tr>
<td width="200">Woman booked herself late</td>
<td> ☑</td>
<td colspan="4" style="white-space:nowrap;"> ☑ Other (give reason below)</td>
</tr>
<tr>
<td>Recently moved to area</td>
<td> ☑</td>
<td rowspan="3" colspan="5" class="tableContainerRow2" > </td>
</tr>
<tr>
<td>Transferred from another hospital</td>
<td> ☑</td>
</tr>
<tr>
<td>Late booking by Midwife</td>
<td> ☑</td>
</tr>
<tr>
<td>Intrapartum</td>
<td> ☑</td>
<td>Posnatal Admission</td>
<td colspan="4"> ☑</td>
</tr>
<tr>
<td>Antenatal Admision</td>
<td> ☑</td>
<td>Intrauterine Transfer</td>
<td colspan="4"> ☑</td>
</tr>
<tr>
<td >Antenatal Check Routine</td>
<td > ☑</td>
<td style="white-space:nowrap;font-weight:bold;">Gestation: Weeks:</td>
<td width="30" class="tableContainerRow2"> </td>
<td style="font-weight:bold;">Days:</td>
<td width="30" class="tableContainerRow2"> </td>
<td > </td>
</tr>
<tr>
<td>Postnatal Check Routine</td>
<td> ☑</td>
<td colspan="2">Postnatal Check Other</td>
<td> ☑</td>
<td>Day</td>
<td width="30" class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px">
<tr>
<td width="20%">Details</td>
<td class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px">
<tr>
<td style="white-space:nowrap">Consultant Appt Made</td>
<td>YES</td>
<td> ☑</td>
<td>NO</td>
<td> ☑</td>
<td width="50%"></td>
</tr>
</table>
</div>
<div class="divContainerWhite">
<table class="tableContainerWhite" cellspacing="10px">
<tr>
<td style="text-decoration:underline;font-size:1.1em;font-weight:bold;">Baby</td>
<td>Routine Check:</td>
<td> ☑</td>
<td>Other Check</td>
<td> ☑</td>
<td>Day</td>
<td width="30" class="tableContainerRow2"> </td>
<td> </td>
</tr>
<tr>
<td colspan="9">Details</td>
</tr>
<tr>
<td colspan="9" class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainerWhite" cellspacing="10px">
<tr>
<td colspan="6" style="font-size:1.1em;font-weight:bold">PUK</td>
</tr>
<tr>
<td>Weight</td>
<td> ☑</td>
<td >SBR</td>
<td> ☑</td>
<td > </td>
<td> </td>
</tr>
<tr>
<td style="white-space:nowrap">Feeding Advice</td>
<td> ☑</td>
<td>Jaundice</td>
<td> ☑</td>
<td> ☑</td>
<td>TICK ON LEAVING LOCATION</td>
</tr>
</table>
</div>
<!--Footer-->
<div class="footer">
© 2009 Graphnet Health Ltd. All rights reserved. | Disclaimer
</div>
</body>
If it fits on a single page and you always want it to be on a single page, then I would try specifying
page-break-before: always. This would force 2 pages at times when it possibly could have fit on one, but it should always keep the table on a single page, providing it fits.