CSS + Master Pages + Printing

The project I am currently working on has tossed me into the deep-end of Visual Studio 2005 and Master Pages.

Part of this journey is comprehending the “Theme” approach to CSS in the App_Themes Directory versus my much accustomed to way of embedding my stylesheets.

For example when I want to include a print stylesheet I normall embed this in the page:
<link rel="stylesheet" type="text/css" media="print" href="print.css" />

While creating my print stylesheet I realised there is no way for me to add the media=print to the web.config theme reference which looks like this:

<pages styleSheetTheme="Default" />

After a little quick digging with a team-member we quickly discovered (new to both of us) a standard for print which we had no idea existed. The ability to embed your print stylesheet at the END of your main stylesheet using @ media print { }

So bascially you simply copy/paste everything from your print CSS file and place it at the end of your main CSS file inside of:

@ media print { /* Insert your print stylsheet here */ }

It’s true what they say, you learn something new every day. This seemed worth sharing as I had no idea you could do it until now and I consider myself fairly well versed when it comes to CSS.

You may also like...

1 Response

  1. Joe says:

    This post was very helpful. Since this is completely new to me, I did have to make one change to get it to work. It needed to be @media instead of @ media. (no space).

    Hope that helps.

I would love to hear from you.

%d bloggers like this: