Change sizes of text boxes in Configurable List Widget

Hi 

I have two text boxes in the Configurable List widget and would like to change

the size of each one separately. The first one is good. The second box I would

like to make wider (longer- to show more text). Could you let me know the CSS for this?

It is possible to use custom CSS in the configurable list widget to increase the width size.

Can you please share the the form in question so that we can check?

Looking forward for your response.

Hi

The form I am referring to is the Human/Wildlife Inspection Report # 202186058068053

Thank you for your assistance.

Hi! You can increase the size of the second textbox by implementing the following two CSS code snippets.

1. Implement the following CSS code using these instructions: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes/

Make sure that you place this code at the end of your existing CSS code.

iframe#customFieldFrame_92{
width: 600px;
}

2. Implement the following CSS code using these instructions for the "Configurable List" widget: https://www.jotform.com/help/428-How-to-Inject-CSS-Codes-to-Widgets/

Make sure that you place this code at the end of your existing CSS code.

tr > td.col2 > input.translatable{
width: 300px;
}

You'll get the following results after implementing these codes:

Demo of the form after implementing this code: https://form.jotform.com/202204561856957

I hope this helps. If you have any further queries, feel free to let us know.

Thank you!

Thank you so much for adjusting the form for me!

It is perfect.

Have a Super Day

Sorry, 

I was wondering what the code would be

if the second column was changed to a "textarea" instead of "text"

tr > td.col2 > input.translatable{

width: 300px;
}

Apparently we need to have it expand to more lines if needed.

Otherwise it works fine the way it is.

Cheers!

Please change it to this:

tr > td.col2 > textarea.translatable{ width: 300px; }

Basically only the highlighted parted is changed on your original CSS.