-
Freezethemoment4everAsked on February 17, 2017 at 2:44 PM
I have been having this issue for a couple weeks now. Every time a client tries to complete the form via mobile, the time block is all the way at the far right of the page to where it cannot be seen unless some phones allow it to be scrolled over. It is a requirement for my business to have the time stamp there so this error is quite a pain now allowing flexibility for people to use it since I am having to explain to them that this is a problem with the form provider. Is there a way to repair this? Is this something that happened with the update to Jotform v4 or what?
-
David JotForm Support ManagerReplied on February 17, 2017 at 5:37 PM
Which of the two forms you have is showing this issue?
http://www.jotform.us/form/62839170417156
http://www.jotform.us/form/63327368478165
I checked both, and could not locate the field called "Session Date & Time". However, I see the date fields does not display well on mobile view.
Please try injecting the following code to solve the issue: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
@media only screen and (max-width: 480px) {
[data-type="control_datetime"] .form-input span:first-child{
width: 100px;
}
#sublabel_month{
width: 50px;
margin-left: 15px !important;
margin-top: -16px !important;
}
[data-type="control_datetime"] .form-input span:first-child +span{
width: 100px;
}
#sublabel_day{
width: 50px;
margin-left: 15px !important;
margin-top: -16px !important;
}
[data-type="control_datetime"] .form-input span:first-child +span+span{
width: 100px;
}
[data-type="control_datetime"] .form-input span:first-child +span+span+span{
width: 210px;
}
[data-type="control_datetime"] .form-input span:first-child +span+span+span+span{
width: 50px;
}
[data-type="control_datetime"] .allowTime-container span:first-child{
width: 50px !important;
}
[data-type="control_datetime"] .allowTime-container span:first-child +span{
width: 50px !important;
}
[data-type="control_datetime"] .allowTime-container span:first-child +span+span{
width: 50px !important;
}
[data-type="control_datetime"] .allowTime-container span:first-child +span+span+span{
width: 50px !important;
}
}
Result: https://form.jotform.com/70476299249975?jumpToPage=2
Let us know if you need more help.
-
Freezethemoment4everReplied on February 17, 2017 at 5:44 PM
It is on form http://www.jotform.us/form/62839170417156; however, I had to separate the date from the time since I had a client trying to access the form today and sign it. I will make the change back and try the code, though I never had this problem earlier with this form since my last two clients have complained about it. Just curious on why it would happen now and not earlier. There is a spot further down under the section of "Events" that it still does the error in not being in the margins if the date and time are put together in the same block. I am not familiar with codes, so if it is an issue, I will reach out again.
-
Freezethemoment4everReplied on February 17, 2017 at 5:51 PM
It worked! At least on Android mobile devices. I will have to test if it works for an Apple mobile device as well. Thank you.