How to remove red boarder around text boxes ?

  • Profile Image
    AutoRepairHelpUS
    Asked on January 16, 2014 at 10:07 AM

    How to remove red boarder around text boxes 

    To my Home Page Form

    Leon

  • Profile Image
    BDAVID
    Answered 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
    AutoRepairHelpUS
    Answered 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
    Welvin
    Answered 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
    AutoRepairHelpUS
    Answered 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
    EltonCris
    Answered 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!