Custom Print format absolute position of Footer error (web view only)

Hi,

I have set up a custom print format based on the default of ERPNext but I am facing issue with the footer position in the page only in the Web view of the document.
Print preview works fine, PDF works fine. But when viewing on the web, the footer position is somewhere in the middle of the document.

Print Preview

PDF Print
image

Web View - Error

Below is the code I am using in the Custom print format

<div id="footer-html" class="visible-pdf" style="display: block !important; position: absolute;	bottom: 0.75in;">
    <div class="letter-head-footer">
        <div style="text-align: center;">{{ footer }}</div>
    </div>

I have not added any custom CSS.

Could any one help me to understand why is i only displaying so in the web view of the document.

Many thanks in advance

1 Like

Are you using the standard Letter Head and Footer feature for rendering Footer in the print format? I believe that will be less effort to get the things right.

Thanks for the reply Umair.

Yes I am using standard Letter Head and Footer feature.

I know this is an old post but it came up in one of the top google search on “ERPNext
print format footer” search.

Solution to this problem is using media print css

<style>
	@media print {
		div.print-footer {
			position: fixed;
			bottom: 0;
		}
	}
</style>

<div class="print-footer">
	Hello footer
</div>
7 Likes

Thanks this code working for me very well