What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
Is there a way to make images within a text field responsive?Asked by riverinatradies on March 05, 2015 at 11:24 PM
The following form has a paypal image within a text field that looks fine when viewed on a desktop but as the screen size gets smaller, as the image doesn't shrink this text field looks a bit messy. On an iphone 4 or 5 there's just a tiny bit of text (1 or 2 words) next to the image which isn't ideal. Is there any custom CSS I can inject to make this look better on smaller reoslutions?
text field size shrink next
I took a look at your jotform and it seems that your image is now being mobile friendly and 'resizable'. I trust that this is no longer present issues, but do let us know if it is.
But it isn't resizable?? The form itself is responsive what I am asking to if its possible to make the image within ther text field responsive as well so when viewed on a small screen resolution the size adjust so it leaves more room for the text
The image is responsive because once you view it on a mobile phone, it go on center and dropping the text down. The image width will only adjust if the screen size is lower than the image width. The image width is 280px. The mobile portrait width is 320px. You can preview the form in the Form Designer with mobile, tablet and desktop.
Doesn't go to the centre when viewing on my phone. And as you can see in screenshot the word "To" is on it's own next to the image which looks awful. This is what I am talking about. :-(
Sorry I didn't read your previous post properly. So to confirm, the only way this will look good on an iphone 6 and smaller is if I make the image at least 415px wide so the image is larger than the screen resolution. Obviously that isn't ideal as then it will be too big when viewing on screens with larger resolution.
Any other solution?
I did check your form in my iPhone 4S device and it seems to display the image correctly. Please check the screenshot below:
When I checked your form in iPhone 6 (browser stack), I am able to replicate the issue you are having.
I went ahead and increased the width of your image to "310 px" and that seems to have resolve the issue. Please check the screenshot below:
I would suggest you to please test your form again and get back to us if the issue persists.