-
Marcus_marcusmaceio894Perguntado em 29 de maio de 2025 às 14:02
Tenho um formulário com um widget "Lista Configurável" com dois campos, sendo que um deles é de horário e, sendo assim, sempre terá a mesma largura estreita. Já o outro campo é de texto, exigindo mais espaço para digitar. Como faço para diminuir a largura do campo de hora e aumentar a do campo de texto, conforme exemplificado na imagem anexada na captura de tela?
Page URL: https://form.jotform.com/251474417646058 -
Jonathan Jotform SupportRespondido em 29 de maio de 2025 às 17:03
Hi Marcus,
Thanks for reaching out to Jotform Support. Our Portuguese 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 Portuguese, 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, you can adjust the width of the time and text fields in the configurable list by injecting custom CSS. Let me show you how:
1. First, copy this code:
/* This CSS is used to adjust the width of the time and text fields in a configurable list widget ticket#27465721 */
@media (min-width: 600px) {
/* Adjust the width of the time field to be narrower */
div.configurable-list-field-wrapper.col1.timeInput-field-selector {
min-width: calc(25% - 8px);
max-width: calc(25% - 8px);
}
/* Adjust the width of the text field to be larger */
div.configurable-list-field-wrapper.col2.text-field-selector {
min-width: calc(65% - 8px);
max-width: calc(65% - 8px);
}
}
2. Open your form in Form Builder, scroll down, and select the Configurable List widget.
3. Click on the Wand icon on the right side of the widget to open Widget Settings.
4. Under the Custom CSS tab, paste the code into the CSS Code box.
5 Click on the Updated button, to save and close the widget settings.
You can repeat the process to all the other configurable list that have the same fields.
Give it a try and let us know if you need any more help.
Your Reply
Something Went Wrong
An error occurred while generating the AI response. Please try again!