-
SoporteOperativoFecha de consulta 1 de marzo de 2025, 20:40
Buenas noches,
Configuro el Widget Lista Configurable pero los campos no me salen en una sola fila
Page URL: https://form.jotform.com/250424711449656 -
John Support Team LeadFecha de respuesta 2 de marzo de 2025, 2:24
Hi SoporteOperativo,
Thanks for reaching out to Jotform Support. Our Spanish Support agents are busy helping other Jotform users right now, so I'll try to help you in English using Google Translate, but you can reply in whichever language you feel comfortable using. Or, if you'd rather have support in Spanish, let us know and we can have them do that. But, it might take a while until they're available again.
Now, coming back to your question, I checked out the form and noticed that the Configurable List widget was set to show in a single row already. However, the specified width was set to only 200 pixels forcing the fields to show up in a column instead of a row. Let me show you how to fix it:
- In Form Builder, click on the Configurable List widget to select it.
- Next, click on the gear icon in the right to open the widget's properties.
- Under the General tab, look for the Width property and set it to at least 668 pixels.
And that's it. The fields should now appear in a single row instead of a column. Here's a link to a cloned form for you to see how it looks after making those changes.
Give it a try and let us know how it goes.
-
SoporteOperativoFecha de respuesta 2 de marzo de 2025, 10:17
HI John,
How can I customize the width of each box. I want to reduce the width of IBS, DNI and Celular boxes and increase the box Nombre de Cliente
Example
-
Reymae Jotform SupportFecha de respuesta 2 de marzo de 2025, 12:37
Hi SoporteOperativo,
It's really easy to adjust the width of each input box on your Configurable List by adding Custom CSS to your widget. Let me show you how:
- Copy the code below:
.configurable-list-field-row {
display: grid !important;
grid-template-columns: 20% 40% 20% 20%;
}
.configurable-list-field-wrapper {
min-width: unset !important;
max-width: none !important;
}
2. In Form Builder, select your Configurable List and choose the Wand icon.
3. Go to Custom CSS tab and paste the code.
4. Click the Update button to save the changes.
-
SoporteOperativoFecha de respuesta 2 de marzo de 2025, 17:37
-
Reymae Jotform SupportFecha de respuesta 2 de marzo de 2025, 18:14
Hi SoporteOperativo,
Just to avoid confusion, I've moved your questions to new threads and helped you there. You can check them out here:
- How can I make that the field not allow to select days in the future?
- How can I make that the field show numbers with "." for decimals and "," for thousands?
Let us know if you have any other questions.
Su respuesta
Something Went Wrong
An error occurred while generating the AI response. Please try again!