When testing Miva's Shadows demo site search field from different iPhones sizes and resolutions (Safari or Firefox), that it zooms-in to focus on search field, but it never zooms-out forcing users to pinch-in browser window to view site width at 100% each time a search is performed. This can't be intentional. Is there a setting of fix for this?
Announcement
Collapse
No announcement yet.
Search field zoom-in problem
Collapse
X
-
Hi Bill,
This is an ongoing issue with iOS. If the input isn't specifically able to be read to be using a font size of 16px, the input element will be zoomed in. From my testing an research, many iOS users have learned this is a common issue and how to deal with it. However, if you would like your site to not do this, you could specify a 16px font size in the c-form-input class.Matt Zimmermann
Miva Web Developer
Alchemy Web Development
https://www.alchemywebdev.com
Site Development - Maintenance - Consultation
Miva Certified Developer
Miva Professional Developer
https://www.dev4web.net | Twitter
-
So the way the problem was avoided with Colossus was by using a font size equal or greater that 16px?Originally posted by Matt Zimmermann View PostHi Bill,
This is an ongoing issue with iOS. If the input isn't specifically able to be read to be using a font size of 16px, the input element will be zoomed in. From my testing an research, many iOS users have learned this is a common issue and how to deal with it. However, if you would like your site to not do this, you could specify a 16px font size in the c-form-input class.Thank you, Bill Davis
Comment
-
Hi Bill,
Correct. You might also try to adjust the font only on focus:
Code:input[type='email']:focus, input[type='number']:focus, input[type='password']:focus, input[type='search']:focus, input[type='tel']:focus, input[type='text']:focus, select:focus, textarea:focus { font-size: 16px; }Matt Zimmermann
Miva Web Developer
Alchemy Web Development
https://www.alchemywebdev.com
Site Development - Maintenance - Consultation
Miva Certified Developer
Miva Professional Developer
https://www.dev4web.net | Twitter
Comment
Comment