How do I change the color and size of the check marks in boxes within a table?

  • Profile Image
    JFNS
    Asked on August 12, 2015 at 12:37 PM
  • Profile Image
    Charlie
    Answered on August 12, 2015 at 03:33 PM

    Hi,

    I assume you are referring to the matrix field? You can try using this custom CSS code and add it under the CSS tab in your form designer tool:

    /**Check box unchecked**/

    input[type=checkbox] {

        -webkit-appearance: none;

        -webkit-user-select: none;

        border : 2px solid black !important;

        color : #444;

        font : inherit;

        margin : 0 1px 0 0;

        outline : none !important;

        text-shadow : 0 1px 0 #F0F0F0;

        cursor : pointer;

        width : 20px !important;

        height : 20px !important;

    }

    /**When checkbox is selected**/

    input[type=checkbox]:checked {

        -webkit-appearance : checkbox; //Default check box when selected

        ...Add your own styling here

    }

     

    However, we can't design the default check marked, you might need to refer to an outside design or image and add it in the part where the check box is selected.

    I hope that helps.