Remove ALL Responsiveness

Hello there,

How do I remove ALL responsiveness from my form? 

I would basically like to have my form stay the same size regardless of where it's being opened....but currently if I reduce the width of a browser or open it up on a mobile it automatically stretched to the size of the browser or screen, even though mobile responsiveness has been disabled? 

So how do I keep my form the same size regardless of the size of screen it is being opened on? 

Thanks, 

WHAT IS SHOULD ALWAYS LOOK LIKE:

WHAT IT ENDS UP LOOKING LIKE:

I see you have a lot of custom CSS code in your form where the width and other styling is set, that's where the problem is starting. If the width is too wide, then the field is push at the bottom to make it more responsive. By default, the forms are using a mobile responsive layout for better viewing experience for the users. Please allow me sometime to check your CSS code and see if I can adjustments.

See if this form works for you: https://form.jotform.com/61434442983964. To have a copy of it in your account, you can clone it by following this guide: https://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

Changes I made:

1. I wrapped all the custom CSS code with this:

@media screen and (min-width: 10px){

...All CSS code here

}

2. After that I set a maximum width of 300px so that it won't adjust:

3. I added these codes inside the custom CSS code you have:

 #customFieldFrame_40 {

        width : 100% !important;

    }

    .form-line {

        padding : 0 !important;

    }

First one is for adjusting the first widget's width in relation with the form's width. The second is to remove the padding when the form is being viewed on a smaller display.

Let us know if that works.

Hey Charlie, thanks for the quick reply!

It's ALMOST perfect! 

It still wraps when changing the size of browser or opening on mobile as per this example :

Is there a way to remove this last bit of auto-wrapping as well?

Usually the sizes of the mobile devices now are at a minimum of 320px. I am not sure if we can have lower than 300px to make it less responsive. The input boxes surely have a min-width. Your CSS code has specific min-width on some of the drop down boxes and text boxes. Which is why the others started to wrap.

If you want, we can just set a horizontal scroll when the width of the viewing device is less than 300px? You can view my form again: https://form.jotform.com/61434442983964. You can see that it doesn't wrap up, but a horizontal bar will be displayed.

Let me see if I can come up with a more suitable solution.

Thanks Charlie, but it still wraps up when opened up on a mobile as per above....iPhone 5. is what I'm testing on.

I made a lot of changes. Could you check this cloned form: https://form.jotform.com/61441769036963.

See if that works on all mobile devices.

This is how it looks like in my end:

iPhone 3GS

iPhone 6S

Let us know if that works for you.

Thanks for the update. I see you made a reply while I was posting mine. Could you check the latest cloned form that I have. See if that works in your iPhone 5 test device.

Your a genius. Thanks Charlie! 

I'm not a genius but thank you for the kind words :)

Should you need our assistance again, please do feel free to open a new thread here in the forum.

Thank you.