Change column width of a single Input Table

  • Profile Image
    epr123
    Asked on September 30, 2017 at 09:32 PM

    I have several input tables on a form. I need to adjust column width individually on each one. Is there a way to do this instead of adjusting all columns on the form globally? I have found the CSS code to inject, but the only place I can find to inject the code is through the Form Designer which applies the changes globally.

    I want the fields on the Target Colleges Input Table to be similar to the width of the Target Colleges Configurable List above it, but you can see that the student info fields become much too wide due to the global setting.

  • Profile Image
    EltonCris
    Answered on September 30, 2017 at 10:50 PM

    Add the ID selector before the class selector of the input table field to target only the specific field.

    Example, with your existing code.

    #id_3 table.form-matrix-table input{
    width:150px !important;
    }

    You can get the ID number through inspect element or within the field settings in the form builder.

    Example:

    Just let us know if you need further assistance about this.

  • Profile Image
    epr123
    Answered on October 01, 2017 at 12:52 AM

    Awesome, that worked! I updated my other tables as well.