Form not scrolling horizontally on mobile devices

The part of the form that is not immediately visible on a mobile device is not loading. It always used to load the whole form and the user would scroll horizontally to access.

please advise

Also, it looks like there is something wrong with the widget when I go to edit the form.

I see you're having an issue with your embedded form and using it on mobile namely not be letting you scroll very well and a widget not working right.

When I checked this on your form by itself on my end other than not being very mobile friendly I found I am able to see and use it normally.

However, in your first screenshot I noticed you're looking at it through your website it seems and that could be related to the cause of the conflict especially if there's any script conflicts between the form and your site.

To check on this problem more accurately for you can you please provide us with a link to the webpage your form is embedded on so we can investigate further?

Something you could try though which might help is to make form mobile responsive but also re-embed it with the iframe code and that might possibly help to resolve it.

Hi there, thanks for the response. I have re-embedded the form and made it mobile responsive, but still no success. The form is located on an employees only section of our website so you would need to sign up for it with an email and password. Go here: http://www.gandselectric.com/time-sheet

Please let me know on here what email you use to sign up so that I can approve your access. 

Thanks for your help.

Thank you for the update.

We'd be more than happy to take a look into this problem further.

I've signed up on the link you've provided using our support email at support@jotform.com so that my colleagues can access it too just in case on of them ends up responding here too.

Please let us know when this is active so that we may investigate it for you.

You now have access.

Config list isn't mobile responsive that's why it creates a horizontal scrollbar in your form when viewed on small screens. You can overcome this by injecting CSS codes on these widgets so they appear perfectly on mobile without any scrollbars. You can use the following CSS codes.

1. For the regular hours field, inject this CSS codes to it.

http://pastebin.com/raw/YXMSxt1P

2. For the overtime field, use this.

http://pastebin.com/raw/njg5Yy4E

You need to inject these CSS codes in the widget wizard under Custom CSS tab.

Example:

After that, inject this CSS code to your form to make the date and full name field mobile responsive.

http://pastebin.com/raw/1N0jsEyZ

Here's a cloned version of your form with all these changes https://form.jotform.com/70575090285964. View this on mobile and you'll see the difference.

If you need further assistance, let us know.

Thank you. I have made the changes and they seem to work fine. This does completely change the look of the form. I understand it is more mobile friendly this way. However, I was hoping to keep the look the same as it is easier for our employees to input their information when they have multiple jobs. Anyway, this will work, thank you for the help.

Great! Glad you like the changes.

It is actually best to make them mobile responsive so fields are easy to fill. :)

And also some built-in mobile browsers do not render the form well when they are not responsive so horizontal scrollbars won't appear.

Hello GandSEandW,

Since your latest question is related to different form, I have moved it to a new thread so that we can address it separately. You will be answered in the following thread:  https://www.jotform.com/answers/1121946

Thank you!