How to hide URL/href when printing bootstrap website

By default, when a website is built using Bootstrap URL’s (href’s) are displayed when you print the page, right next to any linked content.

Bootstrap-HideURLPrint1

 

This comes from bootstrap.css, specifically:

@media print {
  ...
  a[href]:after {
    content: " (" attr(href) ")";
  }
  ...
}

To hide the URL’s from your printed webpages you will need to use your CSS styles to override it.

Simply add this to the bottom of your CSS file:

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

Reference: http://stackoverflow.com/questions/7301989/need-to-remove-href-values-when-printing-in-chrome

Was this article helpful?

Related Articles