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

    What font is the textarea default font?

    Asked by IMCWOW on May 17, 2016 at 10:20 AM

    For some reason the default font for textarea and textbox are not the same. I haven't changed the default font on my form, is there a way to match the textbox and textarea?

    Page URL:
    https://form.jotform.com/61035899318161

    Screenshot
    textarea font textbox same
  • Profile Image
    JotForm Support

    Answered by Boris on May 17, 2016 at 01:02 PM

    Until HTML5, the Text Area field (textarea HTML element) didn't have the same traditional placeholder as a Text Box field (input HTML element), so we have implemented a custom workaround to create our own equivalent.

    This means that our created placeholder will try to appear similar to traditional placeholder of input fields as much as it can, though it may appear slightly differently from placeholders, since each browser may render/draw a real placeholder a little bit differently.

    When it comes to the font used on the Text Area of your form, it is using the following CSS for font:

    .form-textarea {
        font-family: "Lucida Grande",Verdana;
    }

    On the other hand, the Text Box fields are using default font from your system (in my case, Arial). If you want to have the same font applied on both Text Box and Text Area fields, you may want to apply the following custom CSS to your form:

    input { font-family: inherit; }

    It will force the Text Box fields to inherit their font from the form, so it would be the same as the Text Area. You can apply CSS to your form by following this guide:

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

    Please let us know if you need further assistance, we are here to help.

  • Profile Image

    Answered by IMCWOW on May 25, 2016 at 02:06 PM

    This worked, thank you!

     

    Can the same be applied to widgets, for example the masked input widget?
  • Profile Image

    Answered by Ben on May 25, 2016 at 03:11 PM

    I am glad to hear that the CSS worked.

    Now since we can only assist with one issue at a time, I have moved your post to a new thread here: https://www.jotform.com/answers/847181 where we will be assisting you shortly.