Custom Print CSS for Akamai Delivery Reports

If you're impatient and don't want to wait for a report from Akamai to be emailed to you, here's a little CSS that will clean up the Site Delivery page nicely.

@media print {
 html {
  margin-bottom:0;
  min-height:auto;
 }
 #iframeheaderwrapper, #iframefooterwrapper, .navwrapper, #moreoptions, #maininside > form, .helplink {
  display:none !important;
 }
 .iframepage .contentarea {
  min-height:auto;
 }
 .contentarea {
  margin-left:0;
 }
 #moreoptions + * + .shadowwrapper + .shadowwrapper + .shadowwrapper,
 #moreoptions + * + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper,
 #moreoptions + * + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper + .shadowwrapper {
  page-break-before:always !important;
 }
}

Notice the lovely use of adjacent child selectors to ensure proper page breaks.  Most browsers don't support nth-child or page-break-inside so statements like following don't help.

 .shadowwrapper {
  page-break-inside:avoid !important;
 }
 .shadowinside, .shadowinside2, .titlebox {
  page-break-after:avoid !important;
 }
 .graphbox {
  page-break-before:avoid !important;
 }
 .tableinsidegraphbox, .titleboxinside {
  page-break-before:avoid !important;
  page-break-after:avoid !important;
 }

The result is a cleanly printing report that doesn't have boxes breaking across pages. If you want to this be the default print settings for Akamai, you can add a site-specific CSS rule in Firefox.

 

Tags: , ,

Leave a Reply