How can I change the font size of the input texts on the Mobile template of my form?

  • Profile Image
    AlperCayhan
    Asked on November 01, 2014 at 09:34 PM

    One more question: how can I change the font size of the fill in forms (green fonts) in mobile view.

    I would like to give them the same fontsize as the labels.

    Hope you can help me.

  • Profile Image
    raul
    Answered on November 02, 2014 at 12:18 AM

    Hello,

    Upon checking your form, I see that the font size of the inputs are the same as the fields.

    Iphone Emulator

    My Phone

    Please let us know if you were able to set this by yourself or I'm missing something.

    Thanks.

  • Profile Image
    AlperCayhan
    Answered on November 02, 2014 at 02:55 AM

    The fontsize in my form is too smal, see screenshot.

     

  • Profile Image
    Ben
    Answered on November 02, 2014 at 04:55 AM

    Hi,

    I took a look at your jotform and to me it seems to be similar, but there is a slight variation of the font family and size.

    Now to avoid this please try injecting this CSS to your jotform:


    label.form-label.form-label-left.form-label-auto, textarea.form-textarea, input.form-textbox {
        font-family: "Archivo Narrow";
        font-size: 16px;
        line-height: 18px;
    }

    Now, since I saw that you had set both Archivo Narrow and Verdana (depending on which fields we are looking at, this would be an alternative to use Verdana instead of Archive Narrow for all fields.

     

    label.form-label.form-label-left.form-label-auto, textarea.form-textarea, input.form-textbox {
        font-family: Verdana;
        font-size: 13px;
        line-height: 15px;
    }

    Do let us know how it works for you and if you have any further questions.

    Best Regards,
    Ben

  • Profile Image
    AlperCayhan
    Answered on November 02, 2014 at 05:52 AM

    Hi Ben,

    I've injected the first CSS, because I would like to use Archive Narrow.

    But the fontsize of the fill in field (green fonts) is still the same.

  • Profile Image
    jonathan
    Answered on November 02, 2014 at 07:10 AM

    Hi,

    Can you please try adding this CSS code also

     

    .form-textarea {

    font-family: "Archivo Narrow";

    font-size: 16px !important;

    line-height: 18px;

    }

    I tried this and it seems to affect the textarea input when explicitly done.

     

    Please tell us if still not working.

    Thanks.

  • Profile Image
    AlperCayhan
    Answered on November 02, 2014 at 11:16 AM

    Thanks for your reply Jonathan. It's not only for the textarea, but for all the fill-in areas.

    How do I change the fontsize of all those areas to the same size as the label title fontsize.

  • Profile Image
    AlperCayhan
    Answered on November 02, 2014 at 01:03 PM

    Hi Shadae,

    It's almost done... The font type of the "comment" area is different, see screenshot. I would like to change this into the same font type as the fields above.

  • Profile Image
    AlperCayhan
    Answered on November 02, 2014 at 01:47 PM

    Thanks a lot! Everything is fixed now.

    <3 JotForm!

    Kind regards,

    Alper