Zadot Zadot - 2 months ago 12
CSS Question

Style problems when printing page

I have a problem when wanting to display the print preview of a page. This is how it looks in the browser.

enter image description here

And this is how it looks when I vizualize the previous image I want to print.

enter image description here

These are the styles that I use. And probe with "media = 'print'". Also adding
!Important; at the end of style

<!-- Latest Bootstrap min CSS -->
<link rel="stylesheet" href="/REDRIM/assets/bootstrap/css/bootstrap.min.css">
<!-- Google Font -->
<link href=',300,600,700' rel='stylesheet' type='text/css'>
<link href=',700' rel='stylesheet' type='text/css'>
<link href='' rel='stylesheet' type='text/css'>
<!-- Font Awesome CSS -->
<link rel="stylesheet" href="/REDRIM/assets/fonts/font-awesome.min.css">
<!-- magnific popup CSS -->
<link rel="stylesheet" href="/REDRIM/assets/css/magnific-popup.css">
<!-- timeline CSS -->
<link rel="stylesheet" href="/REDRIM/assets/css/timeline.css">
<!-- animate CSS -->
<link rel="stylesheet" href="/REDRIM/assets/css/animate.css">
<!-- Style CSS -->
<link rel="stylesheet" href="/REDRIM/assets/css/style.css">
<link rel="stylesheet" href="/REDRIM/assets/css/responsive.css">
<link rel="stylesheet" href="/REDRIM/assets/bootstrap/css/print.css" media="print">

What I want is to remove the link that appears on the label

a{outline: none !important;
color: #337ab7;
text-decoration: none;
background-color: transparent;}

Try the following style, but I link when generating the preview to print still appears.


You probably have something in your style sheet telling it to print with the link in parentheses. Remove the code that looks like this:

a[href]:after {
    content: " (" attr(href) ")"

Or you can override it with this:

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