Resize the textboxes of configurable list to fit in one line

1) I needed the Household Information boxes resized to fit the page.

 

 

Reducing the width of the text boxes in the configurable list widget doesn't look good on the form. Would it be fine if we can split the fields to display in two lines? Let us know so that we can provide you with the CSS code to be injected to the widget. 

The other question to resize the form to one page is moved to a separate thread and shall be addressed there shortly.

https://www.jotform.com/answers/979767

Thank you! 

Please try to put the boxes on 2 lines GOD BLESSRegina Green PHCCU Coordinatorwww.PHMBC.org
Hungerstops Coordinatorwww.hungerstops.com 214-454-9532
...

Please allow us some time to work on it and get back to you with relevant information.

Thank you for your patience. 

Please make the following changes to the configurable list widgets on your form.

1. Change the configurable list label alignment to Top.

2. Remove the width set for the widgets and leave it blank.

3. Please inject the following CSS code to the Custom CSS section of the Configurable Lists on your form. Please make sure that you have removed the existing CSS code in the widget.

 

#list > tbody > tr:first-child {

    display: none;

}

td.col1:before { content: "Adults Living in Home"; display: block; min-width: 135px;}

td.col2:before { content: "M/F"; display: block; min-width: 85px;}

td.col3:before { content: "RELATIONS"; display: block; min-width: 135px;}

td.col4:before { content: "SS"; display: block;}

td.col5:before { content: "Age"; display: block;}

td.col6:before { content: "DOB"; display: block;}

td.col7:before { content: "ETHNIC"; display: block;}

td.col5 {

     float: left;

     left: 10px;

     position: relative;

}

td.col6 {

     float: left;

    left: -488px;

    position: relative;

    top: 39px;

}

td.col7 {

    float: left;

    left: -350px;

    position: relative;

}

tr {

    height: 110px;

}

The configurable lists should be displaying as shown below after making the above changes.

As a side note, I notice that you have a field SS in the widget. If you meant to collect the SSN, you are requested to remove this field from the widget. It may be allowed to collect the SSN numbers from the users if you are running an Insurance/banking related organization provided with a proof of business. It is also required to have a signature field on the form which will be signed by your users as an acceptance and the form should be encrypted. Please refer to our terms of usage for more information.

Thanks!