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 to remove red boarder around text boxes ?

    Asked by AutoRepairHelpUS on January 16, 2014 at 10:07 AM

    How to remove red boarder around text boxes 

    To my Home Page Form

    Leon

    Page URL:
    http://www.autorepairhelp.us

    Screenshot
    text boxes
  • Profile Image
    JotForm Support

    Answered by BDAVID on January 16, 2014 at 12:44 PM

    Hi,

     

    You can remove or change the color around text boxes, all you need to do is to copy and inject this CSS Code into your form.

     

    .form-line-error input:not(#coupon-input),

    .form-line-error textarea,

    .form-validation-error {

    border: 1px solid #F8F8F8

    ;

    -moz-box-shadow: 0 0 2px red;

    -webkit-box-shadow: 0 0 2px #eee;

    box-shadow: 0 0 2px #F8F8F8

    ;

    }

    to.form-line-error input,

    .form-line-error textarea,

    .form-validation-error {

    border: 1px solid #F8F8F8

    ;

    -moz-box-shadow: 0 0 2px #F8F8F8

    ;

    -webkit-box-shadow: 0 0 2px #eee;

    box-shadow: 0 0 2px #F8F8F8

    ;

    }

    .form-line-error {

    background: none;

    }

    .form-line-error .form-error-message {

    background: none;

    color: black;

    }

     

    1) Click on Preferences, 2) Form Styles 

     

    3) Then double click on the Inject Custom CSS  area, highlight and replace with the new code.

     

     

    You can see or  clone my own example here

     

    I hope this helps, best regards.

     


  • Profile Image

    Answered by AutoRepairHelpUS on January 17, 2014 at 09:16 AM

    OK, Google chrome and firefox still show the red lines around the Year and Email box?

    Code is injected as you specified.

     

    Leon

  • Profile Image
    JotForm Support

    Answered by Welvin on January 17, 2014 at 11:05 AM

    Hi Leon,

    I can see NO red lines. Everything is good. Here's a screenshot:

    I would also suggest re-embedding your form using our iFrame Method: Getting the Form iFrame Code and clear your browsers cache after doing the changes.

    Thanks

  • Profile Image

    Answered by AutoRepairHelpUS on January 17, 2014 at 01:25 PM

    I cleared out all the cache and can not use iframe in the wordpress theme - will not allow me to stretch the form's text box. Have to use the Wordpress source code.

    Well if you can not see it I hope all is well. Funny thing is I only see it in chrome and firefox, not Explorer

     

    Thank you,

     

    Leon

  • Profile Image
    JotForm Support

    Answered by EltonCris on January 17, 2014 at 02:40 PM

    Hi Leon,

    Just like my colleague, I cannot see any red border around the text boxes in your form on error mode. Here's how it looks on my end with,

    Firefox:

    Chrome:

    The problem might be specific on your side. I did a clear cache with your forms here, can you please recheck? Please make sure to clear everything on your browser like cookies and form data, then recheck it afterwards. It should work just fine.

    Thanks!