Icons squished on iPhone and Android devices about jquery-mobile-icon-pack HOT 9 CLOSED

Hi, hamx0r,

Did you ever find a workaround for this? I'm having the same trouble.

Additional datapoint: this only happens if I'm using a theme created using the JQM ThemeRoller, not if I'm using the stock JQM theme. It looks like you're using a custom theme too.

from jquery-mobile-icon-pack.

Screenshots below:

Using standard theme:

http://games.contraterrene.com/screenshots/standard_theme.png

The home icon appears normal using the standard theme.

Using ThemeRoller theme:

http://games.contraterrene.com/screenshots/custom_theme.png

The home icon is squished to the top, and the wrench icon also appears. There are only two icons squeezed in on this screenshot, but some of the icons cause three to be displayed (just as shown on hamx0r's screenshot).

from jquery-mobile-icon-pack.

Hi There,

The workaround was to use the icon pack's name for the icon instead of the
JQM native name. so insead of (im going based on memory here) icon-plus
youd use icon-fa-plus (for the Font Awesome pack). the proble seems to
come from mixing names from different packs. all of the native icons
appear to be in the FA pack under a different name.
hope that helps!
jason

On Tue, Dec 18, 2012 at 4:23 AM, Tony Hursh [email protected]:

Screenshots below:

Using standard theme:

http://games.contraterrene.com/screenshots/standard_theme.png

The home icon appears normal using the standard theme.

Using ThemeRoller theme:

http://games.contraterrene.com/screenshots/custom_theme.png

The home icon is squished to the top, and the wrench icon also appears.
There are only two icons squeezed in on this screenshot, but some of the
icons cause three to be displayed (just as shown on hamx0r's screenshot).

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/25#issuecomment-11472491.

from jquery-mobile-icon-pack.

Thanks! I'll give it a try.

from jquery-mobile-icon-pack.

Hi Tony

The workaround for me was to use the icon pack names for the native icons.
I'm not by my code now, but if the normal JQM name was "icon-plus" and the
icon pack/font awesome name for the same looking icon is "icon-fa-add" then
use "icon-fa-add". it seems all the native icons show up in the FA pack
under different names, and the weird icon squishing happens when trying to
use the native names instead of the FA names.

hope this helps!

jason

On Tuesday, December 18, 2012, Tony Hursh wrote:

Screenshots below:

Using standard theme:

http://games.contraterrene.com/screenshots/standard_theme.png

The home icon appears normal using the standard theme.

Using ThemeRoller theme:

http://games.contraterrene.com/screenshots/custom_theme.png

The home icon is squished to the top, and the wrench icon also appears.
There are only two icons squeezed in on this screenshot, but some of the
icons cause three to be displayed (just as shown on hamx0r's screenshot).

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/25#issuecomment-11472491.

from jquery-mobile-icon-pack.

Seems to work fine. Thanks!

from jquery-mobile-icon-pack.

sure thing! glad to help!

On Tue, Dec 25, 2012 at 7:00 PM, Tony Hursh [email protected]:

Seems to work fine. Thanks!

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/25#issuecomment-11675031.

from jquery-mobile-icon-pack.

Great work around for the button icons but that doesn't fix the issue with the listview and check box icons. Does anyone have a more comprehensive fix for this?

from jquery-mobile-icon-pack.

Ah, there is an easy fix for this here.

http://stackoverflow.com/questions/14160716/jquery-mobile-icon-pack-squished-on-iphone

Simply make sure your FA Icon CSS file is declared after your custom theme.

from jquery-mobile-icon-pack.