The specified font color changes when I go to the Print View

I have a custom Print Format with a custom Production Order Doctype. In the Print Format I have specified that the font color of certain fields be red.

When I fill the form and change to the printing format everything is correct, but when I click on the Print button and I go to the print preview, the color is lost and everything remains with the default black color.

Why is this happening and how can I solve it?

I think it’s because your browser style’s and the bootstrap CSS might be overriding the custom print format’s styles/css.

In order to fix this, use !important in your style rules.

Hope it helps.


Thanks for your reply! @littlehera

I have solved part of the problem:
Now the font color specified in CSS is maintained. I only need to keep the font color specified in a Javascript script. The situation is the followed:

In a custom Doctype I have checkboxes for additional options. If any option is checked, it is represented in the custom Print Format by filling in a red box. This is done with the following code:

<div id="option1_checkbox">
    {% if doc.opt1_cb == true %}
        <script type="text/javascript">
            document.getElementById("option1_checkbox").style.background = "#E6310D";
    {% endif %}

Is there a way to prioritize that property or should I use a conditional statement in CSS rules?
The method changes because it is not CSS, but it is a Javascript script embedded in HTML code.

you can try using :
element.setAttribute('style', 'background:#E6310D!important');

for that one, or look for another alternative in JS.

You might want to see the following link:

Ou you are the best! my problem has been resolved. :blush:
Thank you very much for offering me your time and your help.