-
GLtenn2019Asked on August 25, 2019 at 6:10 PM
How to get "yes" and "no" multiple choice to show inline with questions? is it possible to get it to look like this?
-
GLtenn2019Replied on August 28, 2019 at 3:24 PM
Hello Thanks for the response. I like the first option, however is there a way to get the yes and no closer together and not so far apart?
-
Welvin Support Team LeadReplied on August 28, 2019 at 4:47 PM
You can do that with custom CSS Codes. We can help you get the custom CSS codes in the form. However, you seem to have changed the style of the form fields.
Do you want it this way and just style it to be on the same line?
Do you also want to apply this styling to all single/multiple choices fields?
Please clarify.
-
Vanessa_TReplied on August 28, 2019 at 9:06 PM
I've cloned your Working Organizer form and made the changes. I've used the following CSS to change the layout for the radio buttons with Yes/No option.
#label_74 {
float: left;
}
#cid_74 {
float: left;
width: min-content;
}
#cid_74 .form-single-column {
width: 200px;
}
#cid_74 .form-radio-item {
clear: none !important;
width: 100px;
margin: 0px;
}
Since the questions with Yes/No option are just ordinary Single Choice fields, in order to apply the changes to all "Yes/No" questions, please find the field's corresponding IDs then add it to the CSS.
How-to-Find-Field-IDs-and-Names
Sample, if you want to add "Can dependent be claimed by someone else?", look for it's unique ID number, which is 59, then add to the CSS above in the format like below.
#label_74, #label_59 {
float: left;
}
#cid_74, #cid_59 {
float: left;
width: min-content;
}
#cid_74 .form-single-column
, #cid_59 .form-single-column {
width: 200px;
}
#cid_74 .form-radio-item
, #cid_59 .form-radio-item {
clear: none !important;
width: 100px;
margin: 0px;
}
Please repeat the steps for all the "Yes/No" questions. Don't forget the comma everytime you add a new field.
Cloned Form: https://form.jotform.com/92397577015971