How to create a form that auto resizes against a changing div width?

  • Profile Image
    Asked on November 02, 2012 at 02:27 PM

    I have a CSS with different @media queries that change the width of the div depending on the width of the browser window. I do not know how to setup the JotForm to adjust to these changes, so during the resize the JotForm gets cut off.

  • Profile Image
    Answered on November 02, 2012 at 02:32 PM


    I would suggest you to embed your form using iFrame method.

    To get your form's iFrame code, please follow the steps below:

    1.  Go to Setup & Embed tab
    2.  Click Embed Form
    3.  Click iFrame

    Just let us know if this doesn't work so that we can further assist you.

  • Profile Image
    Answered on November 02, 2012 at 04:04 PM

    I was already using the iframe method. In the JotForm, I need to set a width, and the @media queries fluctuate between a 25 character column and 80 character column. I just want the form to sit within the div and not limit is fields and boxes, but I can't find the controls to do so.

  • Profile Image
    Answered on November 02, 2012 at 05:23 PM

    Would like to know this as well. I dont like how it will add scroll bars to the sides if the div is to small. Would like the form to dynamically resize. 

  • Profile Image
    Answered on November 02, 2012 at 05:33 PM

    Form width is specified within a form builder.

    However, our default embed code is creating an iFrame on the fly. That iFrame has a 100% width, so you form is taking all the available space of your div. 

    Have you tried to use our default code? If you would like us to check some page, please let us know.

  • Profile Image
    Answered on June 21, 2013 at 03:19 PM

    It in fact does not resize. It is even cut off in your own preview window!

  • Profile Image
    Answered on June 21, 2013 at 03:42 PM


    Please create a separate thread with your concern and kindly add the affected forms so we can check your form settings and correct if needed.