Printing HTML - styles in print CSS ignored

Hi, I've got a webpage that I need to print almost exactly as it appears on the screen.

Currently I've got two style sheets linked to, one for the 'screen' and one for 'print'. I know this is working because the top line of my print CSS is:

@page {size: A4 landscape;}

however I can't seem to alter any of the elements on the print CSS. If I adjust the width, height, even the color it always inherits the stuff from the screen CSS and uses that, ignoring the print CSS. In fact, I can't even define a margin for my page using @page {margin...}.

The two style sheets look like this:

for the screen:
body {..... etc etc all works fine...

for the print:
@page {size: A4 landscape;margin:3cm;}
body {.... etc ALMOST same as above

the print CSS is essentially the same as the screen one, except that I want to define different widths and heights for table elements so I can fill an A4 page with a margin. The printing process ignores the widths and heights from the print CSS, and even ignores the margin definitions. It must be reading the print CSS because it knowns to print landscape.

What am I doing wrong, or am I completely misusing the @page and media commands?

Thanks in advance.
Andy

you need to do this:



you see, the print media styles need to go inside the @page block, not come after it