Mobile font size too big

GK User
Sun Sep 08, 2013 9:09 pm
Hi Support Team,

When viewed with an Android mobile (with Chrome) the font sizes of the template grow too big. I have been trying to desperately modify the files android.css, handheld.css and iphone.css:

Code: Select all
body { font-size: 14px; margin:0; padding:0; font-family:Arial,Verdana,sans-serif; color: #555; }


Nevertheless changes to that line never have had any effect. An example of super-sized mobile font in my site can be found here:

http://www.gomercado.es/condiciones-de-uso

Is there any way to control the mobile font size? My template admin page says Gavern v.2.14.1 (the version of my eSport J2.5 template?)
User avatar
Fresh Boarder

GK User
Sun Sep 08, 2013 9:28 pm
Hi,
different CSS styles for iPhone and Android you will find here:

gk_esport\css\mobile\android.css
gk_esport\css\mobile\iphone.css
gk_esport\css\mobile\handheld.css

But which one are too big default in <p> or in headers <h1><h2> etc.... ?

If you/we used 14px --> is too big --> use 10px or 11px for body

Use separate styles with font-size for <p>, <span>, <h1>, <h2> and <h3> it should help you also.
User avatar
Platinum Boarder

GK User
Sun Sep 08, 2013 9:35 pm
You can use Go-Mobile addon for firefox to emulate mobile device
User avatar
Platinum Boarder

GK User
Mon Sep 09, 2013 11:20 am
Hi,

Thank you for the quick reply, I truly appreciate it. However I am still puzzled over this, as for me it seems that the files android.css, handheld.css and iphone.css are not applied properly.

I made a simple test to the page http://www.gomercado.es/condiciones-de-uso which is a simple Joomla article. I added the tag <p class="mobiles" style="text-align: justify;"> for the first paragraph of text, and then I added the line .mobiles {font-weight: bold;} in all the three CSS files. However, the text does not turn into bold when I view the page with my android mobile.

I also put lines like p {font-size: 8px;} and body { background:#656565; } in the end of all these three CSS files but I see no changes when I view the page with my android mobile.

In my template admin page I have defined (in Basic settings) iPhone layout = android, Android layout = android, and Handheld layout = handheld (I have not changed them from the defaults).

How could I activate the three mobile CSS files?
User avatar
Fresh Boarder

GK User
Mon Sep 09, 2013 8:40 pm
Hi, I have tried this add-on for firefox which I told you, and browser start to use android.css.
User avatar
Platinum Boarder

GK User
Tue Sep 10, 2013 11:53 am
Hi, I wonder if I have the latest version of the template files installed. I downloaded and installed the quickstart package on 06/02/2013, the files and folders in the package had a date of 28/12/2012. According to your Update Section the last update for eSport for Joomla! 2.5 was released already on 15/05/2012 (Version 2.9.1). If the quickstart package always contains the latest template files (and not the originally released ones), I should then have the latest template files installed, am I correct?
User avatar
Fresh Boarder

GK User
Tue Sep 10, 2013 10:00 pm
Check this file:
templates/gk_esport\templateDetails.xml

the latest version should have those info

<creationDate>26 Aug 2013</creationDate>
(...)
<version>2.16.2</version>


If your template is older, please download a new version and install it.
User avatar
Platinum Boarder


cron