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

    How can I style the required fields?

    Asked by guest_30105726846049 on January 11, 2013 at 04:39 PM

    Does anybody know how I can style the required fields when it is not filled in.I wanne change the red color into gray. Is this possible?

    Is it also possible to edit the hover function? I want to edit that yellow color also.

    See attached screenshot.

    Thanks

    Screenshot
  • Profile Image

    Answered by jeanettebmz on January 11, 2013 at 05:41 PM

    Yes, that is possible

    Please check this example

    This is the code I inserted for that particular case

    .form-validation-error {
    box-shadow:none!important;
    }.form-error-message {
    background-color:#C0C0C0!important;}
    .form-line-active{
    background:#C0C0C0!important;}
    .form-line-error {
    background:#C0C0C0 repeat scroll 0 0!important;
    }

  • Profile Image

    Answered by jeanettebmz on January 11, 2013 at 05:43 PM

    On regards to the yellow icon, that is hard coded into Jotform, so the only way to get rid of it is by downloading its source rather than the script one

  • Profile Image

    Answered by guest_30105726846049 on January 11, 2013 at 06:11 PM

    Thanks! Is it also possible to change the color from the red border and the triangle?

  • Profile Image
    JotForm Support

    Answered by NeilVicente on January 11, 2013 at 06:23 PM

    The following codes should help:

     

    .form-error-arrow {
        border-bottom-color#C0C0C0;
    }
  • Profile Image
    JotForm Support

    Answered by abajan on January 11, 2013 at 07:18 PM

    @guest_30105726846049

    It would be advisable to set the .form-error-message background color and .form-error-arrow background color to be different to that of the .form-line-error class background. Otherwise, you won't be able to see the arrow! (But I'm sure you've already figured that out.)