How can I fix the form labels?

G'day JotForm

My form is set for field labels to show with left alignment, but in both preview and when viewed by the publish link labels are in top alignment. 

Could you please review and let me know your thoughts?

thanks
Steve

Hi Steve,

I had a look at your form's code and I can see that your labels are set to the correct CSS class to float left. However, I can see that the labels in your form do not inherit the correct width from their parent element.

In short: You can fix this by injecting the yellow line of the following CSS code into your form's style:

.form-label.form-label-auto {
    display : inline-block;
    float : left;
    text-align : left;
    width: 150px;
}

 To do this, follow these easy steps:

1. With your form open in Form Builder, select the Form Designer on the top right-hand side.

2. In the opening dialog switch to the Styles tab and scroll down.

3. Inject the yellow part of the CSS code above and save your changes.

You can find a comprehensible guide on How to inject custom CSS code also here:
How to inject custom CSS codes

This additional line of CSS code sets the widths of all labels in your form to the standard setting of 150px. If you wish to change the size of the width, you can do so by changing the value for example to 120px.

I do think, custom CSS should not be necessary to align labels to the left. When building my own form I could not replicate this error but adding the custom CSS helps to overwrite it. Maybe the support team could have a look, whether this is an underlying issue.

Please let me know if my solution helps you.

Have a great day!

Tom

Hi,

To add to what @TomTomiko said you should be able to fix the issue by removing the CSS code from the advanced designer.

First access the advanced designer.

After that delete the CSS that you can find in the CSS section and Save.

Let us know if you require any further assistance.

thanks @TomTomiko and @Basil_A... 

I used the second solution and deleted what was in the CSS rather than forcing the width.

thanks both for your help. 

cheers
Steve