Implementing a print stylesheet

stephjnca · May 27th, 2009, 02:38 PM

How do you suggest one implement a print stylesheet? I attached two stylesheets to my masterpage, the main stylesheet and another for printing only, and the print stylesheet is not working quite as well as it does in a straight HTML page; that is, not all formatting and positioning appears to be working. Do you have any suggestions?

Note that I have a button in my masterpage to allow for quick printing. Does it make more sense to create an OnClick button event that prints the page using the desired stylesheet? If so, can you provide some guidance please.

Imar · May 27th, 2009, 03:35 PM

Can you define "is not working quite as well"? When is it not working? Did you set the media attribute to print?

I usally don't bother with a "Print" button as you don't really need it. Almost all browsers have a Print button right on the main toolbar. As a user, I never use the supplied print button unless I know for sure it does something useful to the page first....

Imar

stephjnca · May 27th, 2009, 04:53 PM

Yes, I have set the media attribute to print. Essentially for the print version I want to get rid of my topmast and left nav bar (display:none), and only display the main content at the left margin of the page (no more float). Pretty typical stuff.

Originally I created my website using straight html and both stylesheets work fine together in IE and Firefox. However, once I moved everything to VWD, I somehow lost the ability to set the margins of the main div to 0 (the other divs aren't showing up, which is good), plus I'm getting a border too, which I thought I'd turned off.

Obviously this is a little hard for you to troubleshoot, so I appreciate your efforts (and it's not a big deal in the end). I suppose I was looking for some caveats re using multiple stylesheets in VWD. You didn't give me any, so there don't appear to be any. Great!

As for the usability of a print button, I'll rethink my strategy. Probably you're correct that it's not necessary. Again, thanks for the great book. I'm a tech writer and I think it's super!!

Imar · May 27th, 2009, 04:59 PM

In the end, it all comes down to plain HTML and CSS in the browser, so what works with "plain HTML" should also work with ASP.NET.

Maybe you're having an issue with the client IDs that are changed by the runtime? For example, if you have this:

<div id="SomeDiv" runat="server">....</div>

and this print style sheet:

#SomeDiv
{
display: none;
}

This might break depending on where you use SomeDiv. For example, if you use it in a Master Page, it may end up as:

<div id="ctl00_SomeDiv">.....</div>

which breaks the CSS selector.

HtH,

Imar