Display alternate rows of matrix field in different colors.

  • Profile Image
    Asked on December 30, 2015 at 11:23 AM


    I'm using jotform as a roll call time sheet for our volunteer fire department. There are many, many names in a long row, and it makes it challenging to click the right person at the right place.

    It would be very helpful if I could make every other row a slightly different color, maybe a light grey or light orange background. Is there a way to do this?

    Many, many forms and long matrices use this type of style, here is an example: https://cdn.ablebits.com/_img-blog/alternate-rows/default-table-style.png

    Form link: https://form.jotform.com/53634418851156


  • Profile Image
    Answered on December 30, 2015 at 01:48 PM

    Hello jagarolik,

    Please take a look at the following cloned form and see if this is what you wanted to achieve: https://form.jotform.com/53634912588970 

    If yes then please copy the custom css code form the following URL and inject it in your form:  http://pastiebin.com/56842623a3b37 

    The following guide should help you how to inject custom css code in your form:  http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    The output of the above custom css code is displayed in the screenshot below:


    Alternatively, you can clone the above form and start using it. The following guide should help you in form cloning:  http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!