CODEWITHSUNDEEP
cssprinting
Emperor12
Emperor12

Reputation: 33

How to have part of my webpage not print

I am making about 20 pages of a website all with a PDF in the middle and some ads on the sides. When someone prints the page I want the PDF to print, but not the ads on the sides. Is there a way to do this?

This image shows what I am trying to accomplish:

This is what I'm trying to accomplish

Upvotes: 3

Views: 88

Answers (2)

Bart
Bart

Reputation: 17361

You can add specific styles for printing media.

@media print {
  .my-advertisments {
      display:none !important;
  }
}

The rules inside the @media block will be used whenever you're trying to print the page.

Upvotes: 6

John Koerner
John Koerner

Reputation: 38079

You can have custom CSS for print, so you can simply set the display to none on print:

@media print {
  #something {
       display:none;
     }
}

Upvotes: 4

Related Questions