CODEWITHSUNDEEP
htmlcss
David Brierton
David Brierton

Reputation: 7397

Hiding text in links when the document is printed

I am using a print page button and I am trying to hide the (click here to print) portion of the link when the document prints. (It also shows forms (forms/IRF.cfm) which I do not want to show either.)

<a href="forms/IRF.cfm" target="_blank">Initial Registration Fee Exemption Affidavit - if applicable (click here to print)</a>

I tried inserting span with a class of noprint to hide it with css and that did not work either.

@media print {
      .noprint {
        display: none;
      }
    }

<a href="forms/IRF.cfm" target="_blank">Initial Registration Fee Exemption Affidavit - if applicable <span class="noprint">(click here to print)</span></a>

Is there a special way to do this with text and links?

Any help would be greatly appreciated!

Upvotes: 2

Views: 71

Answers (2)

David Brierton
David Brierton

Reputation: 7397

I found the answer if anyone is looking for this. To remove the paths of the href you will want to do this with the css:

@media print {
a[href]:after {
        content: none !important;
      }
}

Upvotes: 0

ESP32
ESP32

Reputation: 8709

If I try with your code it works perfectly:

<style>
@media print {
      .noprint {
        display: none;
      }
    }
</style>

<a href="forms/IRF.cfm" target="_blank">Initial Registration Fee Exemption Affidavit - if applicable <span class="noprint">(click here to print)</span></a>

To test, please click "Run code snippet", then right-click next to the link "initial Registration...." and select "print".

Upvotes: 2

Related Questions