Im having trouble optimising my form for mobile view

I have already added widget etc.

It seems that existing styles for Submit button and other fields are already set at a fixed number (specifically set in pixels). This is forcing your Submit button to always be 400 pixels wide, even if being viewed on a smaller mobile device.

To remedy this, I would recommend adding the following custom CSS to your form:

.form-all .qq-upload-button, .form-all .form-submit-button, .form-all .form-submit-reset, .form-all .form-submit-print {
    width: 100%;
}

It will make sure that Submit button, Print button, Reset button, and similar use entire available width of the form. Since the form on desktops is already set at width of 400 pixels, it means that these buttons will still appear at 400 pixels on desktop computers, while on mobile devices it will be taking 100% of available space.

You can add the above CSS to your form by following this guide:

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

In case you also want to force the image on the first input field at the top also resize when viewed on smaller screens, you can apply the following CSS as well:

#input_14 { background-size: contain; }

Please try it out, and if you need further assistance, please let us know. Thank you.

Great that has worked well. 

I still have a couple of issues though, can the SE11 CAR text size in the background image also be reduced to keep in theme with the picture?

Also the drop down boxes overhand the edge of the screen can this be fixed also? with a slight gap in between the two?

Hello,

I've checked the view on my end and the SE11 CAR text size seems to be within its bounds. Have you made the changes already on this text?

Regarding the dropdown fields, you can inject this CSS code into your form:

#id_16 {
   padding-left: 20px;
}
#id_17 {
  padding-left: 10px;
}

Please do get back to us if you have questions or concerns.

Thanks.