Forum Moderators: not2easy

Message Too Old, No Replies

print styles - firefox

         

topr8

10:37 am on Sep 8, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



anyone know of any hacks to force firefox to print sheets of a given size?

am using a custom print style sheet:

@page {size: 5.875in 8.125in;margin-top: 3in; margin-left: 1in;margin-right:1in;}

... is working fine for opera, but not firefox
i've tried sizing just a div instead but no joy

this is for an internal admin task, so i'm not looking for universal usability, i just need it to work on 3 given computers, i can install opera on them all and use it but would rather try any workaround if any first:

the scenario is that i need to print an A5 sheet of paper with a couple of lines of text, center aligned on the printed page and starting 3 inches from the top - i can get it to start 3 inches from the top!

xfinx

12:24 pm on Sep 8, 2006 (gmt 0)

10+ Year Member



<link xmlns="" href="/css/print.css" rel="stylesheet" type="text/css" media="print">

This works fine for me in alle browsers..

yellowbeetle

1:13 pm on Sep 8, 2006 (gmt 0)

10+ Year Member



Howdy -
Eric Meyer has a nice article on print stylesheets (Google "Meyer print stylesheets")
The url is here
[meyerweb.com...]

Have you tried something similar to his example here?


@media print {
BODY {font-size: 10pt; line-height: 120%; background: white;}
}

Good luck -
beep!
~yellowbeetle

topr8

2:10 pm on Sep 8, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



This works fine for me in alle browsers..

thanks xfinx, although i wasn't asking how to attatch a print style sheet!

yellowbeetle, yes that would work for font sizes, but i perhaps didn't explain my problem : positioning is my problem!

i'm tring to get the position on the printed page, i want to print on an A5 sheet (which is 5.875in 8.125in size) and i want the text to be center aligned on the paper starting 3 inches from the top.

the three inches from the top is no problem, the print font sizes are no problem, i've set them to a class like this in the print style sheet:

.pr{font-size:14pt;}
h1{font-size:16pt;}

the print sizes are understood by all the browsers i've tried, as is the top margin,

the problem remains the text-align:center;

both firefox and ie align it center alright but centered as though it was a regular A4/letter sized sheet of paper (so right off to one side of an A5 sheet) - eg they don't understand the page size eg.

@page {size: 5.875in 8.125in;}

opera gets it no problem.

i'm wondering if there is some kind of fixed width <div> hack that will work, i'm trial and erroring it at the moment ... and printing lots of paper up :)

SuzyUK

2:21 pm on Sep 8, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



just a thought haven't tried it, would sizing the body element to those dimensions work?

topr8

8:22 am on Sep 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



good call suzy.

and now with a relatively simple use of cookies to (set nudge lengths) to negate the built in printing borders that the different printers wants to use, it seems to work well... if it would port well on a larger scale i don't know, but the three printers here have got the hang of it!

Setek

2:37 am on Sep 12, 2006 (gmt 0)

10+ Year Member



If it's a fixed-width, fixed-height element you're trying to size (as it should, for example being A5 printed onto A4,) couldn't you:

  1. Fix the width and height;
  2. Absolutely position 50% for left and top;
  3. Negative margin half the width and half the height to margin-left and margin-top respectively; and
  4. Set
    margin: 0; padding 0;
    to
    @page
    to remove the printer's inbuilt margins?

That's all theoretical, but that's how I'd start :)

Robin_reala

12:43 pm on Sep 12, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Fwiw, the root problem here is that Firefox (and other Gecko browsers) don't yet support @page. Gecko's printing support definitely isn't up there with Opera (and I say this as a comitted Firefox user).

topr8

7:42 pm on Sep 12, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



>>Fwiw, the root problem here is that Firefox (and other Gecko browsers) don't yet support @page.

yes absolutely, i've now discovered this, however the work around in this and doubtless other cases are that:

firefox does support body width values in cm, mm and inches
it also supports page-break-after

so it is possible to get it working, opera is undoubtedly the king of print css! but although i'm a big fan, the other 2 people that work with me just can't get into it, so i'm stuck with getting (admin side stuff) to work in firefox as well

topr8

7:46 pm on Sep 12, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



>>Set margin: 0; padding 0; to @page to remove the printer's inbuilt margins?

good points all, but i wanted to keep this very simple, the final one wasn't possible due to lack of support for @page, however i set up a simple system for fine tuning each printer by shrinking the size of the left margin (and top margin), the amount to shrink was stored in a cookie.