Header and Footer in Web page print

asp , css , javascript India
  • 12 years ago

    Hi All,

    while taking web page print out, I have to print customized header and footer.

    Can anybody help me to do this?


    Thanks in advance

  • 12 years ago


    Thanks for your reply. but i want to set header and footer dynamically using mso attributes

  • 12 years ago

    Are you saying you want to dynamically add a header and a footer when someone prints the page? If so you can use the following css code, where the "header" and "footer" divs are invisible unless the page is being printed:

    <style type="text/css">#header {visibility: hidden;}

    #footer{visibility: hidden;}

    @media print {
        #header, #footer {visibility: visible;}


    <div id="header">Header Data Goes Here</div>

    <div id="footer">Footer Data Goes Here</div>


    If you want to add the header/footer dynamically after the page has loaded so it is visible onscreen try using the JavaScript innerHTML() method.

    Hope I could be of any help!

  • 11 years ago
    Hi Is there a way through CSS to use different headers between the first page and the rest when printing multiple pages. We can use the attribute display:table-header-group; in the for example to print the same thead on all pages. But can we print different headers? Example: First page: header1 body Second Page: header2 body Third Page: header2 body . . . Any help is very much appreciated. Thanks!

Post a reply

Enter your message below

Sign in or Join us (it's free).


Why not write for us? Or you could submit an event or a user group in your area. Alternatively just tell us what you think!

Our tools

We've got automatic conversion tools to convert C# to VB.NET, VB.NET to C#. Also you can compress javascript and compress css and generate sql connection strings.

“C++: an octopus made by nailing extra legs onto a dog.” - Steve Taylor