How to reset a directive in CSS?

Question

I use Bootstrap as basis for my style sheets. If I want something to look different as defined in the bootstrap.css or bootstrap-theme.css I simply override it in my custom CSS files, that are loaded after the Bootstrap files. But now I have following case:

bootstrap.css

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

I want, that the background for printing is the same as for the screen.

How can I "reset" the background directive of Bootstrap (without to touch the bootstrap.css)?

Possible duplicate of [Is it possible to override / remove background: none!important with jQuery?](http://stackoverflow.com/questions/17838007/is-it-possible-to-override-remove-background-noneimportant-with-jquery) — roberrrt-s, Aug 24 '16 at 07:45
No, it does not. since that question is about "PURE jQuery and NOT editing of any stylesheets". — automatix, Aug 24 '16 at 08:21
[This one](http://stackoverflow.com/a/17838092/2019043)? Yes. It's no, what I want to achieve (s. my explanation [here](http://stackoverflow.com/questions/39117219/how-to-reset-a-directive-in-css/39117310#comment65581620_39117310)). — automatix, Aug 24 '16 at 09:17

score 0 · Answer 1 · edited Aug 24 '16 at 08:58

0

Well, you should create a custom CSS / LESS file, called maybe bootstrap-overrides.css with the following:

@media print {
    *,
    *:before,
    *:after {
        background: newValue!important;
    }
}

And place it in the head, after the bootstrap declaration, so you can easily overwrite the background value.

edited Aug 24 '16 at 08:58

automatix

14,018
26
105
230

answered Aug 24 '16 at 07:45

Alex Macra

177
8

Thanks for your answer, but it would only work, if I have one single background color for everything. It's not the goal. I want, that the BG colors are kept for `print` exactly as they are defined for `screen`. – automatix Aug 24 '16 at 08:05
1

Then you'll just have to not include that part. You can import from here http://getbootstrap.com/customize/ all the bootstrap components except the print. – Alex Macra Aug 24 '16 at 08:30

How to reset a directive in CSS?

1 Answers1