JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
How do I change width of specific labels?Asked by mychelleblake on August 31, 2016 at 03:04 PM
I need to change the width of some specific form labels. I understand how to inject CSS but I can't figure out how to find the specific CSS marker for each specific label I want to change.
Direct link for the form ishttps://form.jotform.com/62028572420146
JotForm inject CSS label icon
To find out the specific ID of a label you wish to change, the easiest method is to open your form over its direct link (preview your form). There, you can right-click on a desired label in your browser, and select the Inspect Element option from the menu that opens. The option is similar in most browsers, for instance, this is Firefox:
And this is Chrome:
Once the browser tools open, you will be able to see the ID or class of the label you have selected. From the Firefox example shown above, the ID would be #label_23, as can be seen in the following image:
Now that you have the IDs of your desired labels, you can use them in your custom CSS. For example, to limit your desired label to have a width of 150 pixels, we could add this CSS code:
If you need any further assistance, please let us know.
Thanks! I added the CSS changes and they don't seem to be taking any effect. Not sure if I entered them correctly?
Please try to insert !important attribute in your CSS, it should look like this:
Please let us know how it works for you.