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

    In Chrome, why does field focus and error highlighting extend beyond the right edge of my form?

    Asked by kjfuller on December 09, 2014 at 04:48 PM

    The highlight when completing the form hangs over the right side.

    Please advise.

    Kevin Fuller

    wider highlight effect out of box highlights too wide beyond form edge highlights overflow Chrome issue Chrome problem too wide in Chrome
  • Profile Image
    JotForm Support

    Answered by Kiran on December 09, 2014 at 07:16 PM

    Hello Kevin,

    It appears that your JotForm seems to be fine. I've tried submitting your JotForm and doesn't seem to be having any issue. 

    Could you please elaborate if I'm missing something from your query? We will wait for your response.

    Thank you!

  • Profile Image

    Answered by Kevin Fuller on December 10, 2014 at 04:05 PM

    It appears to work currently because I removed the highlight and required fields features. I will turn them back on so you can see what I'm talking about.

    Kevin J

  • Profile Image

    Answered by Ben on December 10, 2014 at 05:26 PM

    Hi Kevin,

    I took a look at both of the jotforms, but I presume that this one had the issue: http://www.jotform.us/form/43426788922163

    I say had since I too can not see the overlay to be wider than the jotform. Can you please confirm if you were able to fix the issue through CSS yourself?

    Best Regards,
    Ben

  • Profile Image
    JotForm Support

    Answered by abajan on December 10, 2014 at 06:15 PM

    Kevin,

    I saw the problem. Please add the following code to the jotform's injected CSS:

    .form-line, .form-line-error {
    width: 278px;
    }

    .form-line-error {
    text-shadow: 0 0 0 #C85757;
    }

    .form-error-arrow-inner {
    border-bottom-color: #FF3200;
    }

    .form-error-message {
    color: #FFF !important;
    font-weight: bold;
    margin-bottom: 10px;
    }

    #id_2 {
    margin-bottom: 20px;
    }

    Only the first rule is necessary to correct the issue to which you referred but I noticed other issues which would be corrected by the others. (Unless, of course, you specifically wanted the jotform to appear that way.)

    When done, your form should look like this clone. If you would like further help with this, please let us know.


    Thanks