IE9 - the descender (tail) part of some lowercase letters such as g, p, q or y are clipped #5307

kytruong · 2012-11-20T06:58:48Z

Issue description:
In IE9, the descender (tail) part of some lowercase letters such as g, p, q or y are clipped.

Steps to reproduce:

Please open below links with IE9, input g, p, q or y into field Text Input (Note that these letters are not clipped in Search Input!)
http://jquerymobile.com/demos/1.2.0/docs/forms/textinputs/
http://code.jquery.com/mobile/latest/demos/docs/forms/textinputs/
You might need to resize one of the vertical windows to make it smaller and see the descender is clipped

Platforms/browsers:

Window phone 7.5 emulator
Or desktop Windows 7 Enterprise / IE9 version 9.0.8112.16421

jQuery Mobile and jQuery core version used:

jQuery Mobile 1.2.0
the lastest jQuery Mobile

Thank you!

jaspermdegroot · 2012-12-01T00:11:34Z

@kytruong

Thanks for the complete issue report.

I just committed a fix for this. Downside of the fix is that the inputs became far too heigh on IE7/8. To resolve this, and some other issues, I made some bigger changes to the textinput widget.

Bigger changes like that is not something we can land in a maintenance release like the upcoming 1.2.1. So we decided to wait with the fix for the issue that you reported until 1.3 as well.

For now you can add this to your custom CSS to fix the issue:

.input.ui-input-text { min-height: 1.4em; line-height: 1.4em; }

And if you use a class to target old IE (e.g. ) you can negate the min-height to fix the height of inputs on IE7/8:

.old-ie .input.ui-input-text { min-height: auto; }

kytruong · 2012-12-05T04:01:09Z

Thanks uGoMobi. I'll try it out and inform you the result.

ghost assigned jaspermdegroot Nov 20, 2012

jaspermdegroot closed this as completed in 1ef2c51 Nov 30, 2012

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

IE9 - the descender (tail) part of some lowercase letters such as g, p, q or y are clipped #5307

IE9 - the descender (tail) part of some lowercase letters such as g, p, q or y are clipped #5307

kytruong commented Nov 20, 2012

jaspermdegroot commented Dec 1, 2012

kytruong commented Dec 5, 2012

IE9 - the descender (tail) part of some lowercase letters such as g, p, q or y are clipped #5307

IE9 - the descender (tail) part of some lowercase letters such as g, p, q or y are clipped #5307

Comments

kytruong commented Nov 20, 2012

jaspermdegroot commented Dec 1, 2012

kytruong commented Dec 5, 2012