How can we align varios fields so that they form nice columns?

I'm creating an inventory form and there are several fields that I need to line up. I believe I have to do something to the CSS coding but I know nothing about coding. Can someone help me with my inventory form: http://form.jotformpro.com/form/52097174034958

I have checked your form, and it looks like you do have it showing in each line for separate items.

You can position fields the way that you did, by right-clicking on them in the Form Builder and using Shrink, with Merge to above line and Move to a new line. You can see more in our guides on How to Position Fields in JotForm, as well as Field Positioning.

As I do see that your conditions might not have been set up correctly, I have cloned your form into my account and re-created them. You can see this form here:

http://www.jotformpro.com/form/52114383477961

If that is how you wanted to set up your conditions, feel free to clone it back into your account by following our guide on How to Clone an Existing Form from a URL. Please let us know if you need any further assistance, and we will be happy to help.

Thanks Boris - yes I found a work-around. 

I changed the positioning of the Radio Button options and for whatever reason that lined up my "Quantity F" and "Quantity M" Text boxes. The only instance it didn't work is when I remove the "Male" radio button option from the field - then it doesn't line up again with the other lines - ugh!

Great to hear that.

Now in regards to that specific field, we can help you with that.

If I understood you correctly, you do not want it on your form, but it is there because you need it for alignment?

If so, you can leave it to take the space on the form, just not be visible, by adding this CSS code:

.form-line span.form-checkbox-item:last-child {
    visibility: hidden;
}

On the other hand, if you do not want it to take the space, you can add the following instead:

.form-line span.form-checkbox-item:last-child {
    display: none;
}

but this would be as if you had removed it manually.

Now if you want only specific fields to be removed, do let us know and we can help you with the CSS code that.

Oh and the CSS above, you can see how to use it on your jotform by following the steps here: Inject Custom CSS Codes just make sure to always add the given CSS code at the bottom - under all the other CSS code in that same field.

Thank you Ben - your support Team is amazing @ jot form! 

The issue I have is for the line "Bras" - as you know, males don't wear bras so I don't need that radio option, or "Quantity M". I just need the Female radio option and "Quantity F". If I remove the Male option - the "Quantity F" is no longer aligned with the other "Quantity F" boxes. Does this makes sense? For lack of better term, it smushes the Quantity F box with the radio button. 

On behalf of my colleagues, you are welcome :)

The "Bras" field has the id_45, so we can use it in our CSS.

Try adding the next CSS in order to hide the "Male" option.

#id_45 span.form-checkbox-item:last-child {
visibility: hidden;
}

Thank you.