Adjust field width of Configurable List

Can I adjust the width of the fields in the widget Configurable List?

For instance, I want to make the first field shorter and the second field wider.

Hi wkwan,

Yes, it is possible to adjust the width of the Configurable List values by changing the CSS code, but I do feel that in your case the best option is to change type of the input field for Phase Number to be a number instead of the text. This automatically lets form fillers to only input numbers to the field and makes the field less width compared to Phase Name -->

Best regards,

Tommi

Hi Tommi,

That answers one part of the question. What about lengthening the "Phase Name" field? Some of the entries I expect would be long and it would be better to be able to show the user all of the text they have entered instead of needing to scroll.

Also note sometimes my users need a period in the Phase Number, such as "63.02", so I must keep that field text instead of number.

Hi wkwan,

Yes this is possible through changing styling values with Custom CSS. If you want to set Phase Name field input field to be for example 200 pixels instead of current 120px, you can add following code line to your custom CSS code.

input[type=text] {    width: 200px;}

This code changes size of the all input fields which have type set to be text. In case you have more fields coming to your configurable list that contain text, please reply with your published Form to me so I can adjust the CSS styling to point only to Phase Name field. If the logic is same as in my form the correct code would be following:

.col2 input[type=text] {    width: 200px;}

Happy to help,

Tommi

Thank you