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

    There is an error when is used background color and white color fonts

    Asked by _soluciones on May 30, 2013 at 11:47 PM

    Hi,

     

    First, my congratulations for such excellent job with Jotforms. Your work is so inspiring on quality and dedication. In that way, I want to indicate an error that happens when:

     

    - A background is set to a dark color

    - Fonts are set as light color

     

    Text blocks doesn't grab the background color, so it keep white background... with light color fonts. It doesn't work.

     

    I strongly ask you to fix this little issue (I guess) because it keep some forms with design totally useless.

     

    Please let me know about this issue.

     

    -Thanks

     

    Page URL:
    http://jotform.us/form/31498579363166?

    style size font thanks
  • Profile Image
    JotForm Support

    Answered by Welvin on May 31, 2013 at 01:24 AM

    Hi,

    Thanks for your feedback. You may also disable field highlighting to avoid color issues when your focus or click fields in the form.

    1. Setup and Embed

    2. Preferences

    3. Field Styles > Highlight Effect

     

    Thanks

  • Profile Image

    Answered by solucionesfrescas on May 31, 2013 at 02:30 PM

    Thanks. It helps! But -I don't know why- the boxes remain white, when I set the backgroud color to non-white. I want to keep the boxes colors at the same background color. Is important for branding, but I don't get it.

     

    I want to know how to set the same color to the whole form.

     

    http://jotform.us/form/31498579363166?

     

    Thanks in advance

  • Profile Image

    Answered by sidharth_kch on May 31, 2013 at 03:41 PM

    @solucionesfrescas

    Please inject the following custom css and see if that solves your issue:

    Headings:

    .form-header-group {

    background: #82173D;

    }

     

    Text Boxes:

    .form-textbox {

    background: #82173D;

    }

     

    Text Areas:

    .form-textarea {

    background: #82173D;

    }

     

    Dropdown Selectors:

    .form-dropdown {

    background: #82173D;

    }

    Let us know if you need further assistance.

    Thanks,

    Sidharth

  • Profile Image

    Answered by _soluciones on June 01, 2013 at 11:11 AM

    Thanks Sidharth, but unfortunately, it doesn't change it:

     

    Boxes don't change

     

    The form link is the same of the one at the beginning of this thread, and I confirm the changes of the css injection pushing the button "Close Settings"

     

    If you can have access to my account, it ould be great. I really want to solve that issue.

     

    Thanks in advance.

  • Profile Image
    JotForm Support

    Answered by EltonCris on June 01, 2013 at 12:21 PM

    Hi,

    I have removed the white background on your form headers. Kindly review and let us know if you want further changes.

    Best Regards!

  • Profile Image

    Answered by _soluciones on June 02, 2013 at 04:18 PM

    Thanks Elton, I really appreciate your effort... but unfortunately, the problem still remains. I don't understad why.

    Here's the CSS Injection:

     

    Headings:.form-header-group {background: #82173D;}Text Boxes:.form-textbox {background: #82173D;}Text Areas:.form-textarea {background: #82173D;}Dropdown Selectors:.form-dropdown {background: #82173D;}@font-face {

    font-family: 'Lato';

    font-style: normal;

    font-weight: 400;

    src: local('Lato'), local('Lato'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/qIIYRU-oROkIk8vfvxw6QvesZW2xOQ-xsNqO47m55DA.woff) format('woff');

    }.form-all, .form-all label, .form-all input, .form-all select, .form-all button, .form-all textarea{

    font-family: 'Lato', sans-serif;

    }.form-header-group {

    text-transform: uppercase;

    }

     

    ---

    Is posible to fix it? Thanks in advance

  • Profile Image

    Answered by pinoytech on June 02, 2013 at 07:38 PM

    Hi,

    Can you please take a look at this cloned form if this what you want to achieved?

    http://www.jotformpro.com/form/31527714907962

    If yes, please replace your current css codes into this:

    /*--Headings--*/

    .form-header-group {background: none !important;

    }

    /*--Text Boxes--*/

    .form-textbox {background: #82173D;}

    /*--Text Areas--*/

    .form-textarea {background: #82173D;}

    /*--Dropdown Selectors--*/

    .form-dropdown {background: #82173D;}

    @font-face {

    font-family: 'Lato';

    font-style: normal;

    font-weight: 400;

    src: local('Lato'), local('Lato'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/qIIYRU-oROkIk8vfvxw6QvesZW2xOQ-xsNqO47m55DA.woff) format('woff');

    }.form-all, .form-all label, .form-all input, .form-all select, .form-all button, .form-all textarea{

    font-family: 'Lato', sans-serif;

    }.form-header-group {

    text-transform: uppercase;

    }

    If you need further assistance, do let us know.

    Thank you!

  • Profile Image

    Answered by _soluciones on June 11, 2013 at 01:05 AM

    Thanks, and my apologizes for not give my apreciation before. Your job is outstanding.

  • Profile Image

    Answered by sidharth_kch on June 11, 2013 at 01:18 AM

    @soluciones

    You are welcome.

    Glad to know that your issue was resolved.

    Should you have any questions feel free to contact us.

    Thanks,

    Sidharth