Jotform preview does not match what shows up on my site

  • Profile Image
    EliteInsites
    Asked on September 28, 2017 at 01:21 AM

    I have struggled with this problem time and time again, always giving up and going in and altering the CSS on my own. Why is it so difficult to get the Jotform Preview to look the same on my published form? I don't recall these issues happening with V3 of your builder. Please see attached screenshot.

  • Profile Image
    candy
    Answered on September 28, 2017 at 02:27 AM

    We're sorry for the inconvenience you have.

    I have checked your form named "Pennmarma Website Inquiry Form" embedded in your website. I have seen that you have used source codes of your form in order to embed it. 

    I have seen that the CSS codes of a container in your website affect the form. 

    I recommend you using iFrame embed codes to embed the form as you can see in the following guide: https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code This solution is much better than embedding the form with source codes. 

    Plese try this option and let us know if the issue still persists.

  • Profile Image
    EliteInsites
    Answered on September 28, 2017 at 11:43 AM

    iframe does not help. Jotform apparently sees the size (width) of the HTML embed widget in my site builder as though it is the page width.

    I don't understand why Jotform can't simply provide users with a way to completely disable responsiveness. Ever since they added this by default, I've had nothing but problems.

  • Profile Image
    EliteInsites
    Answered on September 28, 2017 at 11:44 AM

    The embedded source code is simply different from the CSS Jotform uses when it displays the preview of the form on your site. That much I'm sure of.

  • Profile Image
    Marvih
    Answered on September 28, 2017 at 01:25 PM

    Hi I cloned your form upon checking your website and it looked like this.

    After cloning I checked it in preview mode and in the published build and it still looked the same. I then removed the custom CSS and re-design using the advanced designer https://form.jotformpro.com/72705001129950 .

    Are you able to CLONE that one and see if it still does not show the same in preview mode and published.

    Let us know how it goes.

  • Profile Image
    EliteInsites
    Answered on September 28, 2017 at 02:13 PM

    I gave up and just went in and manually changed all the CSS with a lot of !imporant;

    Which I HATE to do, but JotForms gives me no choice. Very frustrating.