Is there a way I can hide a DIV when I am doing a print of my page with CSS?

Question

I would like to print my page without headings.

Is there a way I can:

• make the heading <DIV id="heading"> not show when I am doing a print

• and make a <DIV id="summary"> show only when doing a print?

Answer 1

@media print { 
 #heading{
  display:none;
 }
 #summary{
  display:block;
 }
}

Answer 2

try to hide/show them via @media blocks:

inside css:

@media print {
  #heading {
    display: none !important;
  }
}
@media screen {
  #summary{
    display: none !important;
  }
}

Answer 3

.heading{display:none;}

means setting the display property to none ..will hide the element