Forum OpenACS Q&A: css @media print page break

I'm trying to make a page break when printing a web page.
When using the @media css the web page does not page break on the tables with the "pagebreaker" class. I also link to another css file for the screen css.

Anyone have any ideas???

Following is the css for the @media

@media print {

body {
background-color: #ffffff;
background-image: none;
color: #000000;
text-size: 10pt;
}

#pagebreaker {
page-break-before: always;
}

#layer1, #layer2, #layer3, #layer4 {
display: none;
}

#inputbutton {
display: none;
}

#layer5 {
position: absolute;
left: 2px;
top: 10px;
width: 100%;
vertical-align: left;
}
}

This is the HTML code:

<table id="StudentData">
<tr>
<th class="columnheading">ID<br>Number</th>
<th class="columnheading">Student Name</th>
<th class="columnheading">Academic<br>Year</th>
</tr>
<tr>
<td class="smalltextbold">0090</td>
<td class="smalltextbold">TEST NAME 2</td>
<td class="smalltextboldcentered">2003</td>
</tr>
</table>
<table id="StudentData" class="pagebreaker">
<tr>
<th class="columnheading">ID<br>Number</th>
<th class="columnheading">Student Name</th>
<th class="columnheading">Academic<br>Year</th>
</tr>
<tr>
<td class="smalltextbold">00990</td>
<td class="smalltextbold">TEST NAME 3</td>
<td class="smalltextboldcentered">1995</td>
</tr>
</table>
<table id="StudentData" class="pagebreaker">
<tr>
<th class="columnheading">ID<br>Number</th>
<th class="columnheading">Student Name</th>
<th class="columnheading">Academic<br>Year</th>
</tr>
<tr>
<td class="smalltextbold">00990</td>
<td class="smalltextbold">TEST NAME 4</td>
<td class="smalltextboldcentered">2000</td>
</tr>
</table>
<br><br><br>

-------- end of question ---------------