CSS hide placeholder on print [duplicate]

Question

This question already has answers here:

Removing input placeholder on a printable version of an html page (2 answers)

Closed 8 years ago.

Is there a way to hide an input's placeholder text in the print style sheet. I have a form that can optionally be printed and faxed/mailed. I don't know why someone out want to do that, but that's what the client wants. So the placeholder text is in the way on the printed document.

Answer 1

Taken from the accepted answer here: Removing input placeholder on a printable version of an html page

You can use a print media query to change the text color transparent. It doesn't "remove" the text, but makes it invisible, so same result...

@media print {
  ::-webkit-input-placeholder { /* WebKit browsers */
      color: transparent;
  }
  :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
      color: transparent;
  }
  ::-moz-placeholder { /* Mozilla Firefox 19+ */
      color: transparent;
  }
  :-ms-input-placeholder { /* Internet Explorer 10+ */
      color: transparent;
  }
}