format page for printing

[Former Member]

I have a Style sheet that defines how my page lays out when a user request to view it. However, my problem is when the user tries to print the page, there is an inch of space at the header. How can I remove or decrease the size of the header using the CSS?

[Former Member]

Well, if the additional spaces is located between the top of the page and the header, then you can try to limit the padding and the margin-top of the body.

Try to put this code in your CSS stylesheet:

body
{
    top: 0px;
    padding: 0px;
    margin: 0px;
}

You can use more specific styles, like margin-top and padding-top, if suits you.

Hope this can be useful to you

-

-

---

Fabiano Simões

[Former Member]

Works great, but I still have a .25" margin at the top of the page. Is there a way to reduce this?

[jcgood25]

Your windows printer drivers might be dictating this - try changing them in your preferences.

[Former Member]

"border-collapse: collapse;" might help.

[Former Member]

Try to put all the content of the page in a DIV. Then, set this style on the div:

style="position: absolute; top: 0px; margin-top: 0px; padding-top: 0px;"

When the position is "absolute", you can place the DIV element in any place you want on the page, just setting the position based on the coordinates. The "top" style is the distance between the top of the page and the top of the DIV. Then, setting the "top" style to 0px on a DIV with absolute position will give no distance between the page top and the DIV top.

If your content is a table and you will put it into the DIV that I've described, you can set the vertical align to top on the DIV style, so the table will be fixed at the top of the div, like this:

style="vertical-align: top"

Recall that the property "valign" of DIV, TABLE and other HTML elements are not a DOM property, so it may not work in some browsers. Use only the style vertical-align.

Try it to see if it works for you.

[Former Member]

This did not work, but thanks!!

[Former Member]

Chip,

This is a common request, but there isn't a common solution. You may spend a lot of time using CSS to get a print out to look perfect coming out of one printer, but it may not work the same coming out of a different printer with a different driver. Web pages are meant to be displayed in a web browser. Trying to perfect them to a printer is very, very difficult.

If you absolutely need to have perfect prints, I would recommend creating a PDF of the web page or sending the output to a "report writer" like Crystal Reports. These programs have much more control and precision with print outs than any web browser.