Increase row label text size of input table.

  • thecrusher24
    Asked on June 20, 2024 at 3:00 PM

    I would like to make the labels larger inside the Input Table on my form. Under the Equipment table on page 2 there is a list of All-in-One, Chromebooks, Desktop Servers, etc. Also under the Supply List table, I would like those labels to be larger as well. (2 Wheel Dolly, Batteries, etc)

  • Sidharth JotForm Support
    Replied on June 20, 2024 at 3:20 PM

    Hi thecrusher24,

    Thanks for reaching out to Jotform Support. You can customize the font size of the input table with the help of CSS code. Let me show you how:

    1. In Form Builder, click on the Paint Roller icon at the top right corner.
    2. Click on the Styles tab.
    3. Scroll down to the Inject Custom CSS section, and paste the CSS code given below:
    /* Change the font size of the input table row header*/
    th.form-matrix-headers.form-matrix-row-headers {
      font-size: 1em !important;
    }

    If you want to change the font of the QTY header, add the CSS code given below:

    /* Change the font size of the input table column header*/
    th.form-matrix-headers.form-matrix-column-headers.form-matrix-column_0 {
      font-size: 1em !important;
    }

    Increase row label text size of input table Screenshot 30

    That's it. Check out the screenshot below to see the result:

    Increase row label text size of input table Screenshot 41

    Give it a try and let us know how it goes.

 
Your Answer