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

    hint example font size and align

    Asked by alvincosio on August 06, 2013 at 06:28 PM

    Hi,

    is there a way to change the size of hint example? i want the text to be smaller, the text is left-center to the textbox.

     

    http://www.southernindustrialandtruck.ca/blank-page

     

    thanks,

    Alvin

  • Profile Image

    Answered by cesar_melendez on August 06, 2013 at 08:08 PM

    Hello Alvin,

    The hint example can be modified by injecting a CSS code in to your form.
    Your email textbox's id is #input_19, so the code to inject should look like the following: 

    #input_19{
    font-size:10px;
    text-align:center;
    }

    Doing this will allow you to make the font smaller and align it to the center of the box.

    You could also align it to the right by changing it to text-align:right;


    Below I'm appending the images on how to achieve this and the links to additional CSS information:

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

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

    Steps on how to inject the code:

    fontcss

    Exmaple on how my hint example looks after modyfing it using the steps above.

    hintexample-example

  • Profile Image
    JotForm Support

    Answered by EltonCris on August 06, 2013 at 10:07 PM

    Hi,

    You can also use the following codes if you'd only want to change the hint styling.

    .form-textbox::-webkit-input-placeholder {

       text-indent:5px;

    }

    .form-textbox:-moz-placeholder { /* Firefox 18- */

       text-indent:5px; 

    }

    .form-textbox::-moz-placeholder {  /* Firefox 19+ */

       text-indent:5px; 

    }

    .form-textbox:-ms-input-placeholder {  

       text-indent:5px; 

    }

    Guide: How to Inject Custom CSS Codes to your Form

    Thanks!