Remove headers and navigation areas from a printed SharePoint page

By default, when you print a SharePoint page, the header and navigation areas print as well, which is typically undesired. This can be overcome by adding a few CSS statements to the master page or to the CSS file used by the website.

@media print 
{
/*for SharePoint 2010 environment */
        #s4-titlerow, #s4-statusbarcontainer, #s4-topheader2 { display:none; visibility: hidden; }
        #s4-leftpanel { display:none; visibility: hidden; }
        #MSO_ContentTable { margin: 0 0 0 0 }

/*for a SharePoint 2007 environment */
        
        .ms-leftareacell,.ms-globallinks,.ms-siteaction,.ms-areaseparatorleft, 
        .ms-rightareacell,.ms-areaseparatorright, .ms-areaseparatorcorner, 
        .ms-titlearealeft,.ms-titlearearight,.ms-searchform,.ms-banner, 
        .ms-buttonheightwidth,.ms-buttonheightwidth2 
        { 
                display:block; 
                visibility:visible; 
        }        

        /*  This hides header and quick navigation */ 
        .ms-globalbreadcrumb { display:none; visibility: hidden; } 
        .ms-globalTitleArea { display:none; visibility: hidden; } 
        #nav-wrapper { display:none; visibility: hidden; } 
        .ms-titlearealeft { display:none; visibility: hidden; } 
        .ms-navframe { display:none; visibility: hidden; } 
        .ms-nav { display:none; visibility: hidden; } 
          /* move content to the left */ 
        .ms-bodyareacell, #above-main { margin: 0 0 0 0 } 
         /* fonts normalization */ 
        .ms-formbody { font-size: xx-small} 
         /* remove the actions buttons */ 
        .ms-toolbar { display:none; visibility: hidden; }
       /* expanding edit form controls on the width of the screen */
        #onetIDListForm  { width: 100%; } 
       .ms-formlabel { width:20% } 
       .ms-formbody {  width: 80%; } 
       .ms-long { width: 100%; } 
       .ms-rtelong { width: 100%; height: 400px; } 
       .ms-rtetoolbarmenu { width: 100%; text-align: left; } 
       TEXTAREA.ms-long { width: 100%; } 
       .ms-formbody SPAN SPAN DIV { width: 100%; }
 }

ReTweet this Tip!