Card Form: How to make the configurable list widget's fields show in multiple lines on card form?

In configurable forms, I want the fields to go to another line instead of the user having to scroll to get to the other fields. How would this be possible?

I would be running into the issue where the user would attempt to submit a question but the form wouldn't let them due to all of the questions not being answered because the user doesn't know to scroll to get to the other ones. Any suggestions via CSS?

Hi Stanley,

Thanks for reaching out to Jotform Support. Unfortunately, we currently don't have any way to inject custom CSS codes in the Card Form. However, it's possible to add multiple rows for the Configurable List Widget by adding Maximal Rows Number.

Here is the result:

Here is the cloned form I have made a workaround with for your reference.

Give it a try and let us know if there's anything else we can help you with.

Hi Justin,

My biggest concern is if you take the screenshot below -

How would my user know that he needs to scroll to the right to finish filling in the required information? The scroll bar under the sections disappears if you're not using it.

Any suggestions?

Hello Stanley,

Thanks for getting back to us. I checked your form and it is using the Card Style form. Please note that CSS Code can only be used on a Classic Style of form. Also., if a card style is used, the configurable list widget's fields will be shown in a single line. If you want, what you can do at the moment is use the Multiple Text fields widget instead. Let me show you how to add it:

• On the Form Builder page, click the Add Form Element on the left.
• Then go to the Widgets tab and look for Multiple Text Fields widget.
• Drag and drop it into the form and set it up as required.
• Then click the Update Widget button to apply the changes.

Once that is done, you will get this result:

Give it a try and reach out to us again if you have more questions.

Thanks for the reply Norwyn.

It's a little unfortunate that's the best solution. It takes away from having different field types (Dropdown, number, etc. etc.) it seems. Can lead to user inputting incorrect data or format.

Thanks for the help always

Hi Stanley,

Thanks for getting back to us. I created a ticket and escalated this to our Developer team.

Although we don't know exactly when the issue will be updated, we’ll circle back to this thread when we have an update.

As a workaround for now, you can use the Multiple Text field widget or you can switch to Classic Form type since the configurable list widget is displaying the fields in multiple lines. Check out this guide on how to do that.

Thanks for your patience and understanding, we appreciate it.

Hi Stanley,

Thanks for getting to us. The Card Form only works with single line. So, we disabled this feature on Card Form.

Thanks for understanding and let us know if you need for more help.