reveal search box

iphone safari font size changes on rotation 30/09/2009

i've been doing some web development targetting iphone, and one of the things you have to learn to support is rotation.

one thing that has annoyed me recently is that when you rotate, the font size changes. google didn't reveal anything, so i thought i'd blog here about it.

if you set:

html {
  -webkit-text-size-adjust: none;
}

then it will not automatically adjust the fonts of the page when it rotates. the downside of this is that the font size also does not adjust in a regular webkit browser. but if you're targetting iphone specifically, then it is not such a big deal.

add commentAdd a comment
Brent says
3
Great thanks !

Also, to get rid of the top shadow on the text inputs for mobile safari, add this to your css.

-webkit-appearance: none;

cheers !
  • 1 month ago (11/02/2010)
Alex Shestakov says
2
Very nice!
  • 2 months, 3 weeks ago (22/12/2009)
Jean says
1
very nice. the changing fonts did annoy me too. thanks for the hint
  • 2 months, 4 weeks ago (14/12/2009)