What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

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.


  • Profile Image

    How to position asterisk on required field for a plain check box agreement field?

    Asked by montsho on July 02, 2015 at 11:39 PM
    Also, I know I could just use the basic checkbox but the asterisk (required field) would be in a completely different place. It makes the form look sloppy. Is there a way to put the asterisk where I want it to be? I guess that's two questions...
  • Profile Image
    JotForm Support

    Answered by Charlie on July 03, 2015 at 12:06 AM

    You can position the asterisk using custom CSS code if you are using the plain check box field for the agreement field.

    Here's my sample form: http://form.jotformpro.com/form/51828488514970?

    Here's the steps how I edited mine.

    1. First, open the form in your Form Designer tool.

    2. First, we want to select the specific element, you can do that by hovering on the fields and double clicking them. In this case, I want to change the blank label with the asterisk. I want to change its width.

    3. After double clicking, you'll see in the CSS area its specific CSS path or selector. We can now design or style that specific element. Here I just changed the width.

    4. I then repeat the same process but I'm selecting the actual asterisk.

    5. After double clicking the asterisk, you'll see its CSS path or selector at the right side. I then positioned it using this code:

    CSS path or selector {

    position: relative !important;

    left: 20em !important

    }

     

    You'll see that the asterisk is now placed at the end of the text. To learn more about the Form Designer Tool and the custom CSS code, you can check these guides:

    http://www.jotform.com/help/300-Form-Designer-Tutorial-Let-s-create-fantastic-forms- 

    http://www.jotform.com/help/75-Customize-your-Form-using-Custom-CSS-Codes 

     

    I hope that somehow helped. Do let us know if you need more information on this.

    Thanks.

  • Profile Image

    Answered by montsho on July 06, 2015 at 07:20 AM

    Thanks. A few years back, I left you guys and paid for Formstack. They were just awful. JOTFORM IS SO WORTH IT. Small business owners everywhere need to know about your service. It's more than just forms. #itseverything

  • Profile Image
    JotForm Support

    Answered by BJoanna on July 06, 2015 at 10:34 AM

    On behalf of my colleague, you are welcome.

    Also thank you for your kind words. We are happy to hear that you are satisfied with JotForm.

    Feel free to contact us if you have any other questions and we would be happy to assist you.