css - HTML print with absolute postitions -
is possible print html page absolute positioned elements paper? seems browsers doing big mess here. easy define body absolute units (eg. cm) , place elements position: absolute inside. however, every browser seem try make impossible print such page. ff example adding print margins, when printing pdf on linux despite 0-margin page settings. chrome seems shrink page in every case. how print absolute positioning, eg. paper form fields, markings etc.? have overseen something?
sadly, css3 module: paged media allows happen. rules concerning pages big:
3.3.3. rendering page boxes not fit page sheet
if page box not match target page sheet dimensions, user agent may choose (in order of preference) to:
- render page box @ indicated size on larger page sheet.
- rotate page box 90° if make page box fit page sheet.
- scale page box fit page sheet. (there no requirement maintain aspect ratio of page or of elements on page when scaling; however, preservation of aspect ratio preferred.) [done chrome]
- reformat page contents, including 'spilling' onto other page sheets. [done many other or older browsers]
- clip overflowed content (least preferred).
the user agent should consult user before performing these operations.
3.3.4. positioning page box on sheet
when page box smaller page size, user agent should center page box on sheet since align double-sided pages , avoid accidental loss of information printed near edge of sheet.
and rule breaks positioned stuff:
[...] also, when boxes positioned absolutely, may end in "inconvenient" locations. example, images may placed on edge of page box. when boxes use fixed or relative positioning, may end outside of page box.
a specification exact formatting of such elements lies outside scope of document. however, recommend authors , user agents observe following general principles concerning content outside page box:
- user agents should avoid generating large number of empty page boxes honor positioning of elements (e.g., don't want print 100 blank pages). note, however, generating small number of empty page boxes may necessary honor 'left' , 'right' values 'page-break-before' , 'page-break-after'.
- authors should not position elements in inconvenient locations avoid rendering them. instead:
- to suppress box generation entirely, set 'display' property 'none'.
- to make box invisible, set 'visibility' property.
- user agents may handle boxes positioned outside page box in several ways, including discarding them or creating page boxes them @ end of document.
have @ second paragraph of section 3.7: a specification exact formatting of such elements lies outside scope of document. since there no other document , no other guideline general principle following paragraph, every browser can whatever want.
it's 1 of flaws in css3 module. however, think flaws cannot removed css4 or revised css3 module, variety of possible stylesheets , resulting layouts huge cover. note little footnote given in css print profile:
‡ printer may ignore positioned elements placed on page before position of current element in normal flow.
so it's not possible create same effect in every browser. time being, possible way achieve portable document create pdf third-party application or via pdf printer , favorite browser. every other way bound fail long either w3c's recommendations aren't strict or browser vendors implement whatever want.
see also:
- css3 module: paged media (working draft, last revision 2006)
- css print profile (working draft, last revision 2006)
additional notes
if have bunch of position:absolute elements need printed it's question whether element needs positioned absolute, or if same effect can achieved in different or easier way. note should use display:none on each element isn't needed printed media, such ads, navigations, etc...
Comments
Post a Comment