Why are my embedded form fields not showing up in the same place as the preview?

  • Profile Image
    robross0606
    Asked on January 11, 2012 at 12:55 PM

    For some reason, my embedded form (http://www.sosdogs.org/adoption-app-new.html) fields are all misaligned but the preview on JotForm looks fine.  One the second page ("Personal Information"), the Fax is on the wrong line and the Occupation fields are obviously misaligned.  Everything looks perfect on the Preview page (http://www.jotform.com/form/20093135197).  Not sure what's wrong.

  • Profile Image
    AtacanC
    Answered on January 11, 2012 at 01:11 PM

    I've just visited your website and checked your form. It seems to be working fine. I've also took a screenshot. Please click here to see it. Can you please try to clear your browser's cache or try it with a different browser?

    If you still experience the said issue, please let us know which browser you are using.

  • Profile Image
    robross0606
    Answered on January 11, 2012 at 01:26 PM

    Turns out I had Internet Explorer "Compatibility View" enabled.  That breaks the layout.  It looks okay with Compatibility View disabled.  Also looks okay in Chrome.

  • Profile Image
    AtacanC
    Answered on January 11, 2012 at 01:28 PM

    Glad to hear that it works fine now. Feel free to contact us if you have further concerns.

  • Profile Image
    robross0606
    Answered on January 11, 2012 at 01:49 PM

    I spoke too soon.  This is still broken in Internet Explorer 9 even with Compatibility Mode explicitely disabled.  Unless somehow compatibility mode is enabling automatically and not indicating it on the browser.

     

    Check the second page of http://www.sosdogs.org/adoption-app-new.html using Internet Explorer.

  • Profile Image
    NeilVicente
    Answered on January 11, 2012 at 02:01 PM

    Hi Rob,

    Your form is embedded using full source codes. Please re-embed your form, this time using script Embed or iFrame method.

    To get your form's codes:

    1.  Click Setup & Embed tab
    2.  Click Embed Form button
    3.  Choose Embed or iFrame option (Embed is more ideal)



    4.  Copy the codes provided in the succeeding screen

    Let us know if you're still having problems after applying the changes I proposed.