iPad / iPhone Formatting broken after form color background change

JotForm Support

This is our primary form

https://secure.jotformpro.com/form/52581404304952


All we did was change the back ground colors to grey and now on an ipad all the columns are going full length.

How do we fix?

On an ipad / iphone want fields to look like. If we change the form backgrounds to grey suddenly the fields go fullscreen and the labels align right.

https://secure.jotformpro.com/form/52788104005956

Dylan

I have tested your form on my Samsung Galaxy S4 and on iPhone simulator and your form looks like this.

And on iPad simulator it looks like this. 

You can use Form Revision option to revert your form back to an older version.

http://www.jotform.com/help/294-How-to-View-Form-Revision-History 

Also I noticed that your form is not responsive in all media queries and different devices will resolve it differently meaning on some devices that have bigger width, form will not be responsive. You can make your form responsive by adding Mobile Responsive widget. 

Second form https://secure.jotformpro.com/form/52788104005956 that you provided is not responsive.

When you make your form responsive form fields will adjust to the width of device.

Let us know if you need further assistance.

Hello, 

We tested this with a physical iPad and got different results when viewing our forms in portrait mode. 

The first form with the default, white background looks as expected:

However, the second form with the changed grey background makes the text fields take up the full width of the screen:

We just wanted to know why changing the background color caused this issue with the field length. We wanted to make sure that our form looked the same across all devices with a grey background. 

Also, too add, we tested this on an iPhone and got the same results:

Your gray form, 52581404304952, has a Default Theme applied to it. It looks like you were once experimenting with the Sunset theme, or another theme, and later re-applied the Default Theme to cancel out other special themes.

The Default Theme is a theme (CSS file) that contains our default styles. By default, it tries to make forms mobile responsive.

Applying the Default Theme made your form mobile responsive, and the fields of this form take full width on screens that are under 768 CSS pixels wide.

I hope this helps. Please let us know if you need further assistance.

Thanks for the information, do you know how to remove those settings so our gray form looks like the form with the white background. 

It seems we want it so our forms aren't mobile responsive, so it doesn't automatically resize the textboxes when the screen is under 768 CSS pixels. 

Can you confirm that this was the form http://www.jotformpro.com/form/52581404304952

I was able to make the form section background color back to default by selecting the Default Theme in the Theme selection in the Form Designer.

Please see the image below on how to use.

Here is a demo form output with backround theme reset to Default Thame.

Please let us know if this did not work.

Thanks.