Changing colours for matrix table headings

  • lizdavies1992
    Asked on July 3, 2020 at 11:55 AM

    This is my form: https://form.jotform.com/201741673801350

    I have a lot of matrix tables in place and I would like to be able to change all of them so the

    - Heading for the first column is green, with the values being a faded green
    - Heading for the second column is yellow, with the values being a faded yellow
    - Heading for the third column is red, with the values in that column being a faded red

    I have tried ti illustrate this below:

    1593791689RAG rating   matrix tables Screenshot 10

    I know how to change all rows/column headings, but how do I change the colour of them individually?

    Thanks

  • VincentJay
    Replied on July 3, 2020 at 2:08 PM

    Please add this custom CSS code to your form:

    th.form-matrix-headers.form-matrix-column-headers.form-matrix-column_0 {

        background: #98ff98;

    }

    th.form-matrix-headers.form-matrix-column-headers.form-matrix-column_1 {

        background: #ffff7b;

    }

    th.form-matrix-headers.form-matrix-column-headers.form-matrix-column_2 {

        background: #ff7b7b;

    }

    You can update the Hex color codes to your own preferences

    To add the custom CSS code to your form, please follow this guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

  • VincentJay
    Replied on July 3, 2020 at 2:10 PM

    Just to add, here's the result after adding the custom CSS code:

    1593799783vbdgasd Screenshot 10

    Thank you.

  • lizdavies1992
    Replied on July 3, 2020 at 6:50 PM

    Thanks for your help!

  • lizdavies1992
    Replied on July 3, 2020 at 8:38 PM

    How do I remove row visibility for specific forms?

    I think my code is incorrect:

    #cid_1705.form-matrix-row-headers {
        display : none !important;
    }

    #cid_1705.th:nth-child(1){
        display: none;
    }

    Please can you indicate what I need to change?

  • Girish JotForm Support
    Replied on July 3, 2020 at 9:31 PM

    Hello,

    We will address your last question on a new ticket link and will address that shortly.

    Here is the new link: https://www.jotform.com/answers/2429406