Cannot zoom text on desktop Safari nor Google Chrome

[pierrickchabi]

While testing accessibility features against jqm I went into this : I cannot zoom text on desktop Safari nor Google Chrome.
I know jqm is mobile-focused but many people use it to built cross-platform apps that also target desktop.

To reproduce it -> open http://jquerymobile.com/test/docs/pages/index.html and try zooming the text or the page, exclusively with browser's menu zooming options or keyboard shortcut. (don't use touchpad pinch nor mouse as they sometime have a different effect from nor shortcut)

The result I get on Mac OSX 10.7.3 are :

• Opera (Version 11.62 Revision 1347 ) : OK.
• Firefox (Version 12.0) : OK
• Google Chrome (Version : 18.0.1025.165) : Only affects the buttons. No effect on the text.
• Safari for Mac (Version 5.1.4 (7534.54.16)) : No effect at all. (touchpad pinch - and probably mouse trick - does a global zoom and adds scroll bars)

[MauriceG]

Hi!
I've recognized this also with Safari 5.0.5 on Windows but I think it's a browser issue.
If you zoom for example http://jquerymobile.com/test/docs/toolbars/bars-fixed.html, there are
text passages that gets zoomed and other parts not. In code examples even mixed.

[pierrickchabi]

Hi,

Thanks for sharing this page link (
http://jquerymobile.com/test/docs/toolbars/bars-fixed.html) with mixed
texts.

Tested it and got this, on Chrome on Mac :

• Default view : http://www.webpagescreenshot.info/img/23696-426201220236PM
• After zooming, mixed zoom :
  http://www.webpagescreenshot.info/img/67821-426201220617PM

Same bad behaviour on Safari. Perfect zooming on Opera and Firefox.
Will digg a bit to find the properties that make some of jqm typos fully
zoom-compliant or not...

On Thu, Apr 26, 2012 at 12:57 PM, Maurice Gottlieb <
reply@reply.github.com

wrote:

Hi!
I've recognized this also with Safari 5.0.5 on Windows but I think it's a
browser issue.
If you zoom for example
http://jquerymobile.com/test/docs/toolbars/bars-fixed.html, there are
text passages that gets zoomed and other parts not. In code examples even
mixed.

---

Reply to this email directly or view it on GitHub:
#4218 (comment)

[MauriceG]

Is the example

the text that is not zoomed, has the <strong>tag set.

[pierrickchabi]

Other input :

Not zoomed :

• ui-btn-text class
• all header typos
• < p >

Zoomed :

• < code >

[toddparker]

We use pixel values to avoid issues with nesting em-based values so it's up tot eh browser in how to manage the text zooming. This isn't a bug with jQM, more of a difference in how browsers handle the zoom feature.

[huan086]

The issue is not with using pixel values, but with -webkit-text-size-adjust:none.

There is a bug in desktop webkit browsers in that they do not ignore this setting meant only for mobile https://developer.mozilla.org/en-US/docs/CSS/text-size-adjust

The recommended setting is to set to -webkit-text-size-adjust: 100%, which is safely ignored on desktops. http://blog.55minutes.com/2012/04/iphone-text-resizing/

[pierrickchabi]

Thanks, I will test it.

The issue is not with using pixel values, but with

-webkit-text-size-adjust:none.

There is a bug in desktop webkit browsers in that they do not ignore this
setting meant only for mobile
https://developer.mozilla.org/en-US/docs/CSS/text-size-adjust

The recommended setting is to set to -webkit-text-size-adjust: 100%, which
is safely ignored on desktops.
http://blog.55minutes.com/2012/04/iphone-text-resizing/

---

Reply to this email directly or view it on GitHub:
#4218 (comment)

[pierrickchabi]

I will let you know as soon as I check it again : within 2 days.

On Mon, Aug 6, 2012 at 4:06 PM, Scott Jehl <
reply@reply.github.com

wrote:

In our current codebase, we're already using 100%, not none, as it was
in older builds. Are you seeing the problem in the latest version?

---

Reply to this email directly or view it on GitHub:
#4218 (comment)

[huan086]

Problem exists in http://jquerymobile.com/demos/1.2.0-alpha.1/ (still using text-size-adjust: none)
but
http://jquerymobile.com/test/ is OK (using text-size-adjust: 100%)
So don't need to reopen issue.