Search field zoom-in problem

[Matt Zimmermann]

Hi Bill,

Correct. You might also try to adjust the font only on focus:

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;
}

[William Davis]

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.

So the way the problem was avoided with Colossus was by using a font size equal or greater that 16px?

[Matt Zimmermann]

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.

[William Davis]

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?