When you print (or print preview) and elements are cut off (e.g. after 1st page, or "randomly") you should check your CSS rules for these:
Is there an element with "display: inline-block
" that surrounds your content? Make sure it has "display: block
" for printing.
This primarily affects Firefox and Internet Explorer. Chrome seems to be able to handle inline-block
elements in most cases.
Does the element itself, or a container, define "overflow: hidden
"? Use "overflow: auto
" (or maybe "overflow: visible
") instead.
Is the element itself, or a container, using "position: absolute
" or "position: fixed
". You should use "position: static
" (default positioning) for printing.
Note that print rendering varies across browsers even more than screen rendering.