paul_808 — 2012-05-18T15:49:20-04:00 — #1
I am working on a classic asp site. On the landing page I have a div containing the following code <% Main.EmailSignup(false)%>. This leads to a spot in the Main.asp file with some simple text followed by a form with a single input field. On this text I have included a font-size style in a <p> tag. The style works fine on all browsers except mobile. On the iphone the font size is rendered properly then pops to a larger size than it is set for completely altering the layout of my page. Any help would be greatly appreciated. Thanks.
ralphm — 2012-05-18T20:41:40-04:00 — #2
It's annoying the way iPhone resizes text like that. There is a way of preventing it, by adding this to your CSS:
However, it does have some consequences, such as not allowing text to be resized by the user ... even on desktop Safari. :eek:
There was a suggestion around here the other day to try -webkit-text-size-adjust: 100%; but I haven't tried it yet, so not sure if it works.
paul_808 — 2012-05-21T09:29:32-04:00 — #3
Thanks for the suggestion. I used that on my personal site and it worked great. For my companies site, all I needed to do was add some height to the div that contained the text and the problem went away.
ralphm — 2012-05-21T09:37:42-04:00 — #4
Cool. But just as an aside, it's rarely a good idea to set a height on an element with text in it. Some people (like me!) who enlarge their text will see a right old mess.
It's best to let elements fine their own height, based on the content within them.