I am trying to print my web page as a report. I have done css for screen and different for print mode to be able when i pres CTRL+P to print it.
My problem is when I have 2 pages the footer doesn't move to go on page 2 bottom.
How I can do this?
css:
#footer{
position:absolute;
bottom:0%;
width:100%;
height:60px; /* Height of the footer */
border-bottom: 1px solid black;
border-top: 1px solid black;
}
#total{
bottom:85%;
float:right;
text-align:right;
position:absolute;
margin-left:62%;
margin-bottom:2%;
border-left: 1px solid black;
border-top: 1px solid black;
border-right: 1px solid black;
}
#custsign{
margin-left:60%;
margin-top:-10%;
padding-top:3%;
}
#compsign{
padding-top:0.3%;
margin-left:80%;
margin-top:-2.4%;
}
/*#grid{
padding-bottom:30%;
}*/
aspx:
<div id="footer">
<div id="total">
<asp:Label ID="SubLabel" runat="server" Text="Sub Total: " ></asp:Label>
<asp:Label ID="SubText" runat="server" Text="" ></asp:Label>
<br />
<asp:Label ID="DiscLabel" runat="server" Text="Discount: " ></asp:Label>
<asp:Label ID="DiscText" runat="server" Text="" ></asp:Label>
<br />
<asp:Label ID="VatLabel" runat="server" Text="V.A.T.: " ></asp:Label>
<asp:Label ID="VatText" runat="server" Text="" ></asp:Label>
<br />
<asp:Label ID="TravelLabel" runat="server" Text="Travel Exp.: " ></asp:Label>
<asp:Label ID="TravelText" runat="server" Text="" ></asp:Label>
<br />
<asp:Label ID="CurrencyLabel" runat="server" Text="" ></asp:Label>
<asp:Label ID="TotalLabel" runat="server" Text="Amount Due: " Font-Bold="true"></asp:Label>
<asp:Label ID="TotalText" runat="server" Text="" ></asp:Label>
<br />
</div>
<asp:Label ID="ItemsLabel" runat="server" Text="Total No.Items: " ></asp:Label>
<asp:Label ID="ItemsText" runat="server" Text="" ></asp:Label>
<br />
<asp:Label ID="PrevBalanceLabel" runat="server" Text="Prev Balance: " ></asp:Label>
<asp:Label ID="PrevBalanceText" runat="server" Text="" ></asp:Label>
<br />
<asp:Label ID="NewBalanceLabel" runat="server" Text="New Balance: " ></asp:Label>
<asp:Label ID="NewBalanceText" runat="server" Text="" ></asp:Label>
<div id="custsign">
<asp:Label ID="CustomerSignLabel" runat="server" Text="Customer" Font-Bold="true"></asp:Label>
</div>
<div id="compsign">
<asp:Label ID="CompanieSignLabel" runat="server" Text="Companie Ltd" Font-Bold="true"></asp:Label>
</div>
</div>
UPDATE with position:fixed
How about to use the code of this example?