homepage Welcome to WebmasterWorld Guest from 54.237.99.131
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Suggest/Override the Browser from Printing Headers/Footers
Probably nothing now, but maybe an un-yet supported standard?
Jeremy_H

5+ Year Member



 
Msg#: 3206053 posted 6:55 pm on Jan 2, 2007 (gmt 0)

I'm pretty sure I know the answer to my question, I just hope I'm wrong.

When setting a printing style, is there a way to set the paper's margin, headers or footers -- or, at least make a suggestion to the browser.

When a press release is viewed on my page, I want it to use my site's template. However, if this document is printed, I want the press release to have the same format as a standard press release.

I'm almost there, it's just by default the browser puts a header and footer on the page. I know I and the users can change this by hand, but I was hoping there might be some browsers or a CSS standard that supports suggestions by the content creators.

Right now, I'm also offering a PDF version of the file, which I plan to continue to, but it would be nice to have to avoid a second step for site visitors.

 

Setek

5+ Year Member



 
Msg#: 3206053 posted 6:30 am on Jan 3, 2007 (gmt 0)

I'm pretty sure the
@page selector covers the page's margins, however, I'm pretty sure hardly any browsers really support @page for print right this second :)

As for a header and/or footer, which is a really cool idea, this seems almost impossible - barring having your entire content inside a table that has thead and tfoot defined (if a table spills over a page when printed, it will reprint thead and tfoot at the top and bottom respectively.) While a possible hack-solution, it is a fairly icky one.

So, I don't think I have any good news for you...

Does anybody else perchance have some?

londrum

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 8:38 pm on Jan 3, 2007 (gmt 0)

yeah, @page would be really good... if it worked. so i set the margins for @page to zero, and then just add padding to the body tag
body { padding: 3em 2em; }

you are supposed to be able to set a header on every page by just doing one header, and giving it

position:fixed; top:0;

it is then supposed to appear on every page you print off.
it seems to work on firefox alright, but doesn't work on IE6.0. you might want to give it a go though. ...seems like microsoft are doing their best to force everyone into upgrading to IE7 now, so i wouldn't image it will be a major problem for too long.

cmarshall

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 11:05 pm on Jan 3, 2007 (gmt 0)

Printing has been somewhat of a compatibility nightmare for me. The browsers go all wobbly on support.

For example, If I hide headers and whatnot, then set the content to start at position:absolute 0, only one page of a multi-page printout gets printed.

I need to study up on it a bit more before declaring it a mess. I may very well be doing something wrong.

Here [webmasterworld.com] is a question I had asked in a similar vein.

londrum

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 9:30 pm on Jan 4, 2007 (gmt 0)

are you using firefox? that has a known bug with regards to absolute positioning when in print mode.
just get rid of anything that has position:absolute, and it will work okay. change it to position:relative instead.

that might be easier said than done, of course...

cmarshall

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 9:37 pm on Jan 4, 2007 (gmt 0)

Yeah, it's that problem. The issue is that I need to do it in order to make sure there isn't half a page of blankness before the first page prints.

londrum

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 8:33 am on Jan 5, 2007 (gmt 0)

you could try putting a negative top-margin on it instead, to move it up maybe

cmarshall

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 11:16 am on Jan 5, 2007 (gmt 0)

you could try putting a negative top-margin on it instead, to move it up maybe

I'll give it a go, and see what happens. I seem to remember some browser having a fit over negative margins (maybe IE?). In any case, I'll know soon.

Thanks.

SuzyUK

WebmasterWorld Senior Member suzyuk us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3206053 posted 11:40 am on Jan 5, 2007 (gmt 0)

cmarshall, what's causing the half page blankness? Try applying your print stylesheet to the screen and see if you can tell what's causing the blank space

if you hidden some divs header, sidebars etc for print.. you should use display: none, rather than visibility: hidden; and you shouldn't need to position the content you do want printed at all, just let it flow

Try setting position:static; on elements to set the correct default.
Position: relative will also leave space at times, position absolute is the wrong thing to use in print and the reason FF only prints one page is I believe correct, an absolutely positioned element is out of the flow therefore the document does not know it exists (the viewport might, but the canvas doesn't) and the canvas in a print medium is the paper.

what some do is serve their screen stylesheet only to the screen media this makes it easier to write a print stylesheet, you're starting from a blank canvas with no positioning to override, only some divs to hide usually and a bit of font resizing/coloring

HTH
Suzy

cmarshall

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 11:47 am on Jan 5, 2007 (gmt 0)

Yeah, I do display:none.

I just need to spend more quality time with my CSS before I can definitively say what's up.

CSS is a major pain. I just made another post about the Webstandards Acid Test [webstandards.org].

HelenDev

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3206053 posted 1:49 pm on Jan 5, 2007 (gmt 0)

CSS is a major pain

No it's not, CSS is great! :)

cmarshall

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3206053 posted 2:09 pm on Jan 5, 2007 (gmt 0)

CSS is a major pain

No it's not, CSS is great!

I wouldn't be using it if I din't think it was.

CSS isn't the problem. As the acid test [webstandards.org] shows, the problem is with browser incompatibilities.

In a perfect world, CSS would be quite easy. In the real world; not so.

I have written million-line programs in C++, Pascal, Assembly, etc. I've written async device drivers and debugged protocol streams with protocol analyzers and other tools.

Reliable, cross-browser CSS presents as much of a challenge as any of these.

Nevertheless, I do agree with you that it is great, but way too many designers neglect to test it on multiple browsers.

If you really want to see some kewl CSS stuff, check here [cssplay.co.uk].

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved