Form is not centered on mobile devices

4. Finally, I can't get the form to center on Mobile devices. I looked at a number of solutions from admins in the Support forums forum. None seem to work. It won't center in any simulated mobile device in the Chrome Inspector development console.

Hi,

I've checked your form and I don't think this issue is related to the CSS within the form. When you check the direct URL of the form emulating mobile view, it is centered correctly:

It seems like the issue appears after it's embedded on your website.

When you inspect the embedded form it looks like the whole body of the page is off center:

Can you please double-check the code you used to embed your form to see what could cause this?

Please let us know how we can help you further with this.

I just take the exported code that is supposed to be tailored for Expression and paste it in between the body tags of a new blank HTML web page in Expression and the problem appears immediately, the form is shifted to the left on both the web and mobile versions.

I can fix the centering in the web version at the beginning of the injected CSS section, with using:

.form-all { margin: auto !important; }

I don't know the CSS to fix the centering on the Mobile versions.

Kindly inject this CSS code to your form: 

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

         body, .supernova, .jotform-form, .form-all {

            width: 110%;

        }

}

Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

Since your form has been embedded using the source code, you will need to update the embedded code, we recommend proceeding carefully with this if you have added your own code to your web page.