Why footer on the 2nd page is not at the bottom?

I am trying to create a page that displays header and footer on every printed page. So far, the header and footer's position already correct when there is only 1 page to be printed. But when there is 2 pages, that is when this problem occurs. The footer on the 2nd page will not be positioned at the very bottom of the page. I have already set the position fixed and bottom to 0 but still it is still happening. Can someone point out why is this happening and how can i fix it?

<table cellSpacing="0" cellPadding="0" style="height:100%; width: 100%;">
            <tr>
                <td>
                    <div class="divOverflow">
                        <table class=layout style="height:100%; width: 100%; background-color:#ffffff;">
                            <thead style="<%=_sStylingHeader%>">
                                <tr>
                                    <td style='vertical-align: top'>
                                        <%=_sLetterHeader %>
                                        <hr style='border-bottom:1px solid black' />
                                    </td>
                                </tr>
                            </thead>
                            <tbody style="<%=_sStylingContent%>">
                                <tr>
                                    <td style="vertical-align: top">
                                        <div><br /><%=_sLetterContent %><br /></div>
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot style="<%=_sStylingFooter%>">
                                <tr>
                                    <td style='vertical-align: bottom'>
                                        <hr style='border-bottom:1px solid black' />
                                        <%=_sLetterFooter %>
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </td>
            </tr>
        </table>


 _sStylingHeader = "height: 10%; width: 100%; visibility: visible; position: fixed; top: 0";
 _sStylingContent = "height: 82%; width: 100%; visibility: visible";
 _sStylingFooter = "height: 8%; width: 100%; visibility: visible; position: fixed; bottom: 0";