Make textbox fit or compressed on smaller devices like android and ios smartphones/tablets

Hi again superb JotForm Support Team!

Please help me make textboxes very fit or compact.

I hope the view of my very small textboxes will be compressed to each other so that they will look like a calendar design, this is only possible on desktop PCs and NOT on smaller devices. Please HELP...

Please see the sample perfect textboxes calendar design-like below.
I hope that it will also show on smaller devices...

Here's the photos I have using different smartphones and 1 tablet.

Portrait/vertical view in 5-inch android phone

Horizontal view in 5-inch android phone

Horizontal view in iPhone 6







Horizontal view in 5.2 inch android phone

This is the view in JotForm Designer...as you can see textboxes are not compressed...




Here's my form.
https://form.jotform.co/60941088545865

I hope that it will also be possible to compress the textboxes in WordPress page...

As I've mentioned above, compressed textboxes in my WordPress page is possible only on desktop PCs like the photo below...



I will wait for your quick and great assistance ever!

The form is too complex and the easiest way to fix the alignment would be to move the table boxes for 12:00 to 23:30 to the new line, below the row of 11:30. The table is too wide and won't fit on mobile devices. This needs a major adjustment in the custom CSS codes because they are not in a column in general but only align through field positioning. 

Example: https://form.jotform.com/60952370966969. 

I'll do my best to adjust this and let you know.

Hi Sir Welvin!
Thanks for your kind help!

Does your first suggestion can be perfectly fit in small devices like android and ios smartphones and tablets???

But does it have special CSS codes to make this really fit and not far apart from each textbox when viewing on smartphones and tablets in WordPress Page???

I will wait for your best solution.
Thank you as always!

Yes, please check my cloned version of your form. I've modified it to fit it on mobile devices. This form: https://form.jotform.com/60952370966969. 

Yes, a custom CSS codes are required to fit the textboxes. Otherwise, they'll be scrambled on mobile view.

Hi Sir Welvin!
WOW! You're the best!
A millllliiioon thanks for solving my problem! Wew!

By the way, can this be fit also in iPhones???
I have checked the Designer, but the phone simulator there shows broken table.. huhu
Please check the phone below.



I will wait again. Thank youuuu

You're welcome. It's my pleasure to help. You have to view the form using the actual device. I'm not sure why the preview looks like that, but I can verify that the layout is good on the actual device. 

Hi Sir Welvin!

YES! My Japanese boss has accepted this new timetable format.
I can't contain my happiness but praising the LORD GOD for HE blessed me with this very helpful JotForm Support Team!

GOD bless JotForm Support Team more and moooorre!!!

Here's the photos from my Japanese boss' iPhone and tablets so you can see them as well. hehee

To assist you better I have created a new thread that will be answered shortly by our support team

https://www.jotform.com/answers/810919