-
dsc003saifuddinAsked on September 17, 2021 at 2:28 AM
How to adjust the width of each column?
Thank you
-
Cecile JotForm SupportReplied on September 17, 2021 at 11:25 AM
Hello there,
Please allow me some time to check on this and get back to you with relevant information.
Thank you.
-
Cecile JotForm SupportReplied on September 17, 2021 at 6:50 PM
Apologies for the delay.
Kindly inject the custom CSS code below.
select#prefix_105{
min-width: 50px;
max-width: 80px;
}
.dropdown-match-height.form-dropdown{
width: 80px;
}
input#first_105.form-textbox{
min-width: 100px;
max-width: 100px;
}
input#last_105.form-textbox{
min-width: 200px;
max-width: 200px;
}
li#id_105{
min-width: 0px;
max-width: 380px !important;
}
*You may adjust the values according to your liking
Guide: How-to-inject-custom-css-codes/
Result:
Let us know if you need further assistance.
-
dsc003saifuddinReplied on September 18, 2021 at 12:14 PM
Hi Cecile_A,
Worked perfectly! Thanks so much!
But, how to move the sublabel ?
-
Ahmed_SReplied on September 18, 2021 at 6:39 PM
Hello Saifuddin,
I've directly updated the current injected CSS code of your form to apply the required alignment, please check below a screenshot of the result.
And for the reference, here is the updated CSS code that's currently injected into your form.
select#prefix_105 {
min-width : 100px;
max-width : 100px;
}
.dropdown-match-height.form-dropdown {
width : 100px;
}
input#first_105.form-textbox {
min-width : 300px;
margin-left : -100px !important;
position : relative;
}
input#last_105.form-textbox {
min-width : 150px;
position : relative;
}
li#id_105 {
min-width : 0px;
max-width : 720px !important;
}
#sublabel_105_first{
margin-left : -100px !important;
}
Please let us know if you need further assistance, we are happy to help.
-
dsc003saifuddinReplied on September 19, 2021 at 3:24 AM
Very helpful! I am quite happy that finally I found a way.
Thanks Mr Ahmed & Mrs Cecile for your great support