How can I edit the CSS of the Minimal Checkbox widget?

Hello, 

I am using the minimal checkbox widget and I'm trying to edit the styles of the widget. The custom css tab for the widget is not allowing me to apply any styles for some reason and its extremely finicky. Would you be able to give me an example of the structure on how to target the text and change its font size?  I've attached a screenshot of the css tab I am working with.

May we know which Form are you referring to so that we could guide you injecting the CSS code in the widget's CSS tab.

Let us know if you have further questions.

Thanks.

 Hi! The form is https://www.jotform.com/build/90636049498267 - thanks!

Thank you for that information.

If you want to change the height of the text of the Minimal Checkbox widget option, you may inject the following CSS codes in the widget's Custom CSS tab

label {

    color: green !important;

}

You may update the value of the color property in the codes to your preference.

If you are planning to increase the size of the text that it would take 2 lines, you may need to also increase the height of the widget. To do that, please inject the CSS codes below to your form (not the widget) — How-to-Inject-Custom-CSS-Codes

Below are the codes that you will be needing to increase the height of the widget itself. And similar to the codes above, you may update the value of the height property in the codes below to your preference.

iframe[src*="icheck/?inputType=checkbox&skin=minimal"] {

    height: 100px !important;

}

I hope this helps. If you have other questions or concerns, please do not hesitate to let us know.