Forms viewing issues on mobile devices

When viewing my form via a mobile device the form fails to render properly on a small/phone screen. See link (https://cl.ly/n8YN). Here is the link to the form.

(Form Link)

It looks like that your form design/theme is based on a Adobe FormsCentral imported template, so the form looks a bit different on mobile compared to the standard themes.

I have replaced the HTML heading element on your form with a standard Header element and added the next CSS:

@media only screen and (max-device-width: 550px){
.form-line.form-line-column {
margin-left: 0;
}
.jotform-form {
padding-top: 0;
}
.form-all {
padding-top: 0 !important;
width: 100% !important;
box-sizing: border-box;
}
.form-submit-button {
height: inherit !important;
}
.header-logo {
min-width: 75px;
vertical-align: middle;
}
div.form-header-group {
margin-left: 6px !important;
margin-right: 6px !important;
}
}
.form-all {
padding-top: 0 !important;
}
[data-type=control_head] {
background: white;
}

Please re-check the form on mobile.

Thanks. The form looks better on my iPad but the form fields are stretched to the edges of my phone. See link below.

iPhone View

This is normal for mobile view. If you would like to add some paddings around the text boxes we can help with the CSS.

Would you like to have something like this?

Yes that would perfect. Could you also provide me the CSS so that I can apply it to my other forms.

Here is a sample CSS to set the 15 pixels left and right paddings on the mobile view:

@media only screen and (max-device-width: 550px){
.form-line {
padding-left: 15px !important;
padding-right: 15px !important;
}
}

Where exactly would I put this in the form? Once I select the CSS tab in the form is there a specific area where this should be placed?

You can put that particular css code to a place where does not engage with other css codes. I put it to the bottom on the cloned form and it just works as my colleague said. 

Here is the screenshot how your form will be seen after this:

If you have more questions, please do not hesitate to contact us.