---
title: Using printer friendly CSS styles
related:
  - https://docs.kentico.com/k82/developing-websites/designing-websites-using-css/creating-printable-versions-of-pages.md
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

This page explains how to use printer friendly CSS styles on your website. These styles are used only if a page is sent to a printer.

1. Create a new stylesheet in the **CSS stylesheets** application.
2. Name the stylesheet _Printer styles_ and set the **Code name** to _Printer\_styles_ (for example).
3. Write the printer friendly CSS styles, for example:

   ```css title="CSS"

   .zoneLeft, .zoneRight, .zoneTopInfo, .zoneTop, .horizontalmenu, .zoneBottom {
               display: none;
   }

   .eventCalendarDetail .zoneLeft, .eventCalendarDetail zoneRight {
               display: block;
   }

   .eventCalendarDetail zoneRight {
               float: left;
   }

   .logonReg .zoneLeft, .logonReg .zoneRight {
               display: block;
   }

   .logonReg .zoneRight {
               float: left;
   }     

   .zoneContent {
               float: left !important;
   }

   ```

   > **Tip:** **Tip**: To hide elements that you do not want in the print version, add the **display:none;** style to the appropriate classes.
4. Add a link to the printer CSS stylesheet into the __ tag of your master page:

   1. Open the **Pages** application.
   2. Select the root page of your website.
   3. Switch to the **Master page** tab.
   4. Add the link into the **head** section. For example:

      ```html

      <link href="CMSPages/GetResource.ashx?stylesheetname=Printer_styles" type="text/css" rel="stylesheet" media="print" />

      ```
   5. Click **Save**.

The stylesheet applies to the **print** media, i.e. when your sites pages are sent to a printer.