Search jQuery

jQuery Forum

jQuery Mobile

recoverin..

Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

in jQuery Mobile • 9 years ago

Have a look at this on a desktop and then in a mobile browser. (recoveringacademic.co.uk/iTest/index2.html)

Using a Samsung S3 with Chrome and FF, the italics and emphasis both disappear. It's renders perfectly on a desktop.

The issue of italics (or none) really matters to me because I'm writing about Harvard Referencing where- to many - italicization is important.

I'd be very grateful indeed for help

I'm using the following code in the <head>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>

Replies(3)

watusiware

Re: Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

9 years ago

First off, you are using an ancient alpha test version of jQuery Mobile, and you are using it with a version of jQuery that it isn't designed to work with. Is there a good reason for this?

I would not expect alpha code to work correctly. The current version of JQM is 1.3. You're using a pre-1.0 version that was intended only for testing purposes. I wouldn't expect it to support devices released recently, nor would I expect it to work correctly.

I wouldn't expect jQuery Mobile to interfere in any way with display of italics or emphasis. But, then, again, this was an early test version, and it could be a bug in the CSS.

Does it work with a plain web page without jQuery Mobile?

Does it work when using a released version of jQuery Mobile?

recoverin..

Re: Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

9 years ago

Thanks watusiware.

To answer your points: the <em> and <i> tag work fine in a mobile web page without jQM

Using [...]1.3.1.min.css;[...] 1.9.1.min.js and [...]mobile-1.3.1.min.js via the CDN, this happened;

To test the browser further, I created two classes 'italic' and 'huge' in the <head>

{font-style:italic;} and

{font-size:90px;}

and attached those to a <span> in the HTML

Huge works, italic doesn't

I have tested this on a Samsung S3, Samsung S2 and a Sony Experia (my children have relieved me of my other test mobile phones.)

See for yourself(ves) here (http://www.recoveringacademic.co.uk/iTest/index2.html)

I would be really grateful if anyone could suggest the next step for me to take.... please. Apart from locking my testing phones away from my children.

recoverin..

Re: Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

9 years ago

Apologies to all. Chrome on my Samsung S3 still does not render the italics, but with Chrome running on an S2, or Sony Experia both emphasis and italics are rendered properly.

Top Reply

Response title

Attachments

jQuery Forum

Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

Replies(3)

Re: Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

Re: Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

Re: Rendering italics (or emphasis) reliably on Mobile devices (as opposed to desktops)

Statistics

Tags

Actions