Printing Forms with Checkboxes

I had an issue when printing forms with checkboxes where the checkbox marks would not print. This looks like an issue with the background images.

Original Form:
Attachment 24816

Form when printed:
Attachment 24817

My work around was to use the following print-media CSS:

Code:

---

        .x-form-checkbox {
            display: none;
        }
        .x-form-cb-checked .x-form-cb-label:before {
          content: '☑';
          font-size: 18px;
          line-height: 0.8;
        }

       
        .x-form-cb-label:before {
          content: '☐';
          font-size: 18px;
          line-height: 0.8;
        }

---

With the CSS hack above the form now looked like this when printed:
Attachment 24818

I'd say radioboxes would be able to modified in the same way.

Hello!

Thanks for your suggestion! I noticed this happens with most themes when trying to print using Internet Explorer. On Chrome -- at least by checking both "print preview" and comparing on both browsers -- I see the checkboxes.

To test it I opened this exemple: Checkout Form, then opened it on a new tab, standalone. Switched the theme on the full Examples Explorer, then reloaded the standalone example page and then print preview. Triton theme shows the checkboxes on IE's print preview. But all themes shows checkboxes (and radio buttons as well) on Chrome. I'm assuming it will work on Edge, Firefox and Safari as well.

Indeed, it does look like it works if the whole page is printed. If you select a sub-section of the form and choose print selection, the checkboxes disappear (at least with the Gray theme). This also affects other libraries such as printThis (https://github.com/jasonday/printThis) which copy selected elements to an iframe and print from there. I'm guessing the resources don't come through in such circumstances.