BackTrack57
BackTrack57

Reputation: 395

Print Bootstrap button properly

I have a little issue while printing bootstrap buttons and the solutions I found aren't working. This solution didn't worked for me : stackoverflow-solution

I've also tryed to change my browser print settings to force printing background colors without success in Firefox and Chrome.

My button looks like this : enter image description here and if I print it it shows like this : enter image description here

My PHP code for that button is : echo "<button type=\"button\" class=\"btn btn-primary btn-xs\">$value</button>";

Upvotes: 2

Views: 2126

Answers (1)

DavidG
DavidG

Reputation: 118977

By default, the Bootstrap CSS contains this CSS which sets a bunch of styles for printing:

@media print {
    *, :after, :before {
      color: #000!important;
      text-shadow: none!important;
      background: 0 0!important;
      -webkit-box-shadow: none!important;
      box-shadow: none!important;
    }
}

You can solve your issue by either:

  1. Fix your CSS by removing some or all of the above lines (though you only need to remove the background and colour items.)

  2. On the Bootstrap website, generate your own custom CSS with their online generator and untick the option http://getbootstrap.com/customize/.

Upvotes: 1

Related Questions