The form width increases when I embedded on my website

  • Profile Image
    openarmscare
    Asked on August 08, 2019 at 04:41 PM

    Hi, I have a problem embedding my form onto a website.

    Once it's there, the width increases dramatically.

    Anything else I can do? I really can't have it be this wide on the site (and also cant have that horizontal scroll bar you see under the form.

    I've also tried setting the width manually and removing the background etc with CSS 

    Form is here: https://form.jotform.com/92196232489163

    Attached is an image of how it looks on the site

    Screenshot
  • Profile Image
    VincentJay
    Answered on August 08, 2019 at 05:16 PM

    Hi,

    Could you please share your website link where the form is embedded so we can investigate it further?

    We'll wait for your reply. Thank you.

  • Profile Image
    openarmscare
    Answered on August 08, 2019 at 05:34 PM

    Hi, 

    Thank you for getting back to me. The website is live here: https://openarmscare3.wixsite.com/open-arms-care/donate

    As you can see, the right side gets cut off, but the width I've set in the jotform app should not be cutting off like this. I've tried enforcing a smaller width with !important, however the issue persists. When in the editor mode of the site, the form appears as it does in the attached screenshot - with blank space extending outward on the right side.

  • Profile Image
    VincentJay
    Answered on August 08, 2019 at 06:01 PM

    Please try to add this custom CSS code to your form:

    .supernova .form-all, .form-all {

    width: 90% !important;

    }

    To add that to your form, please follow this guide: https://www.jotform.com/help/108-Adding-Custom-CSS-in-JotForm

    Result of my test:

    1565301406afs22.png

  • Profile Image
    openarmscare
    Answered on August 08, 2019 at 06:22 PM

    Thank you! The issue has been resolved. I appreciate your time.