Question

I have a web database app that runs in IE7+ (customer requirement) It is a shop control system that needs to send forms to the printer.

I’ve got @media print css set up to format the form properly when going from screen to printer. Mostly everything has been working fine.

I’ve recently added some jquery code to handle placing a footer at the bottom of the page with a variable size table above it. That works as expected except occasionally the footer is thrown to a second page on the printer even though it displays in the proper place on the screen.

So, my question is how can I get print preview to allow me to inspect the document elements so I can figure out what’s throwing things off? I’ve got the IE Developer Toolbar, but it doesn’t seem to give access to the print preview.

Thanks for any help.

Answer 1

I would suggest throwing different colored borders on your elements in your @media print css file. This is always useful in debugging layout issues and should show up in the print preview.