2

Right now I have my @media print style sheet to hide various objects by ID/class, such as

    @media print {
           #header, #navbar, #navbar, #toolbar, #footer, .title {
        visibility:hidden;
        display:none;
          } 
}

At print preview, it does hide these objects but the space they take up is still there, forcing what I WANT to print to be on page 2, with a blank page 1 and blank page 3. If there is a way to have the only page 2 shows at the print screen, or a way to truncate the stuff I don't want as oppose to just hiding them, please let me know.

Thank you.

Kevin
  • 207
  • 2
  • 4
  • 12

1 Answers1

1

Using visibility:hidden leaves the space the element would occupy, while display:none does not show that space.

You want to use:

@media print {
 #header, #navbar, #navbar, #toolbar, #footer, .title {
  display:none !important;
 } 
}

Of course this has been addressed before: What is the difference between visibility:hidden and display:none?

Community
  • 1
  • 1
Chris Stringer
  • 135
  • 1
  • 6