Firefox printing cuts canvas on end of first page, how do I make it not do that?

Question

http://fiddle.jshell.net/bTtKT/show/

If I print the above page in Chrome as A4 Landscape I get two pages as expected given the size of the canvas on the page, if I do the same in Firefox however (with print preview for example), it gives me only one page and therefor cuts the image/canvas in half. If I change the scale in Firefox however I do start to see the whole image (but then it's too small), so the image is there as a whole but Firefox seams to ignore that its bigger then one page for some reason.

How do I get Firefox to recognize that the image needs more then one page so I can print the whole thing in correct size?

(possible to edit the above page example here: http://jsfiddle.net/bTtKT/ )

Did you ever solve this? I'd be interested to know :-) – thomax Jun 10 '13 at 11:28 — thomax, Jun 10 '13 at 11:28

score 0 · Answer 1 · answered Apr 27 '12 at 14:19

0

I didn't try it out, but you could try:

canvas { page-break-inside: avoid; }

See: https://developer.mozilla.org/en/CSS/page-break-inside

answered Apr 27 '12 at 14:19

RoToRa

37,635
12
69
105

Tried it but it doesn't seam to work, the canvas still brakes. – 01AutoMonkey Apr 27 '12 at 14:39

score 0 · Answer 2 · answered Jun 10 '13 at 11:46

0

Putting this style on the div encompassing the canvas might help ya:

page-break-inside: avoid
clear: both
float: none

answered Jun 10 '13 at 11:46

thomax

9,213
3
49
68

Firefox printing cuts canvas on end of first page, how do I make it not do that?

2 Answers2

Linked