-
esupport.twAsked on April 15, 2018 at 11:57 AM
Hi,
Our form width is 820px.
I hope our each fields a little longer. Also the button is next to our fields.
All fields and button in one row.
1) How to adjust the fields size.
2) Our button more close to second field. Not a blank between it.
I tried to adjust it. It get small result.
What option or CSS that I can change?
Thanks!
-
Kevin Support Team LeadReplied on April 15, 2018 at 12:05 PM
1) You can adjust the drop down size with the code injected on the widget:
.select2-container {
width: 48%!important;
margin-right: 2% !important;
}
You can just change the width value to see how the fields change as well.
2) Please inject the following CSS code to your form:
.form-col-1 {
width: 85%;
}
.form-col-2{
width: auto;
padding-left: 0px;
}
#id_4 div, iframe#customFieldFrame_4 {
width: 100% !important;
}
#id_4{
padding-right: 0px;
}
Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
Result: https://form.jotform.com/81044468434962
I hope this helps.
-
esupport.twReplied on April 15, 2018 at 12:57 PM
Hi,
Wonderful!
One more issue:
The button will jump to next row when submit it.
Hope to keep it in same row.
Thanks!
-
AdrianReplied on April 15, 2018 at 2:45 PM
To make the button stay in the same row, please make the following changes in the CSS of your form. The changes need to be done in line 11 and line 29.
button#input_5 {
height : 50px !important;
margin : 2px 0px !important;
font-size : 16px;
width: 128px;
}.form-col-1 {
width: 80%;
} -
esupport.twReplied on April 15, 2018 at 11:01 PM
It's great now!