Unable to enter texts on fields.

  • Profile Image
    Asked on April 22, 2015 at 11:31 AM

    my form in preview mode works ok - when i enter my name on the "name" field i can see it - BUT when i embed the form on my site, i try clicking to enter a name and see nothing! 

    form preview: http://form.jotform.us/form/51095879725166?

    my site: http://www.2twinsdesign.com/contact.html

    can anybody add insight into this?

  • Profile Image
    Answered on April 22, 2015 at 12:40 PM

    Hi, 2td, 

    I would like to apologize for the frustration you have with the Designer tool.

    However, I have cloned and checked your form and it was working fine with me. By the way, I am using Google Chrome.

    I've also embedded your form on a sample web page and I was able to fill out the "Name" fields also.


    I have tried visiting your website to check if it has something to do with any conflicts on your web page, but I was able to input text also on the "Name" fields and it is visible.

    I would suggest for you to try clearing the cache of your form.

    I wish to help you more. If this is not the issue you are pertaining to, please help us understand the issue more by elaborating a much more concrete examples.

    Thank you for using JotForm.

    Kind regards,



  • Profile Image
    Answered on April 22, 2015 at 01:16 PM

    Hi Mike,

    Thanks for checking it and responding.....

    I found that when i made the input labels any larger in height or width, i couldn't see the input text. The only way i could make it work was to use the default height. So i revised it and cleared the height.

    i have no idea why that would make the input field loose styling!

    I would like the form to match my site a bit more by making the input fields larger - but not if it makes it impossible to fill out. Any ideas how to do this without compromising the form?

  • Profile Image
    Answered on April 22, 2015 at 01:59 PM

    Hello 2td.

    If you want to make only the sub-labels larger, you can add the following custom CSS to your form:

    .form-sub-label { font-size: 14px !important; }

    With that change, your form would look like this:

    In case you want your entire form to appear larger, with all its input fields, you may want to add this custom CSS:

    .form-all,.form-label { font-size: 22px !important; color: #4C403D !important; }
    .form-textarea,.form-textbox { font-size: 20px !important; color: #4C403D !important; background-color: color: #FFFFFF !important; }
    .form-sub-label { font-size: 14px !important; }

    With this added, your form should end up looking like this:

    Please test this out and let me know how it goes.

    Kind regards.

  • Profile Image
    Answered on April 22, 2015 at 02:43 PM

    THanks! that helped.

    it seems that if i enter the css in the form options and NOT in the form designer tool, it saves things ok - but every time i go to the designer tool and add custom css, and then go back to the form, it adds all this other css that overwrites my changes.

    very frustrating!

  • Profile Image
    Answered on April 22, 2015 at 04:02 PM

    I moved your new issue to a thread of its own.  I will follow up with my response in this thread here shortly: