I want to add a footer to an HTML page that will be repeated across all pages WHEN PRINTING. I have managed to achieve this through this code:
@media print {
p.note {
bottom: 0; position: fixed;
}
}
But now I have a problem with this paragraph going on top of the rest of the copy
According this Mirosoft article, this should work for me:
@page :first {
margin-bottom: 4in;
}
But it doesn't, it doesn't change anything... any ideas?
Make sure that the container for the main content makes room for the footer. For instance, if your markup looks something like this:
You'd want some css like this:
How about adding some z-index ? It seems that the footer overrides the last paragraph Also try to use
Here's the solution that worked, CSS is this:
And everything needs to be contained in a separate div with this CSS
This worked perfectly!