Configurable List Widget: How can I control the width of the elements?

Hi, I have list that includes text, a checkbox, and then text again. How can I control the width of these three elements? Can you share the CSS code? Thank you!

Hello Ana,

Thanks for reaching out to Jotform. Please share with us the form and the fields you are referring to so we can check? Also, may we know how you want to fit/display the fields in your form? You've mentioned that you want to control the width of those elements, do you have a particular width size in mind, so we can use them on the CSS code we may share to you in order to achieve your requirement.

Once we hear back from you, we'll be able to help you with this.

Hi Lorenz,

I have added an image of the form elements I would like to modify.

Ideally, I would like to have them all on the same line. Space could be saved by adjusting the amount of space the checkbox element takes + reducing the "Link" text box.

https://form.jotform.com/230263306308346

Hello Ana,

Thanks for reaching out to Jotform Support. Please inject the following CSS code into your widget:

.col1, .col2, .col3, .col4{

min-width: 40px !important;

}

Result:

Let us know if you have any other questions.

That works thank you! Another question: How can I set a specific length for the text fields? For instance, what if I wanted the "Title" field to be slightly wider than the rest?

Thanks in advance,

Ana

Hello Ana,

Thanks for your response. To change the width of the Title field inside the configurable list widget to make it slighter wider than the other fields, please replace the code provided by my colleague with the CSS code below:

.col3{

min-width: 200px !important;

}

.col1, .col2, .col4{

min-width: 40px !important;

}

Result:

Give it a try and let us know if you need help.