Page 1 of 1

How to increase the font size within a <pre> and <code> tag

Posted: Tue Jun 11, 2019 7:33 pm
by GeoffArms48
I am using Joomla 2.5.28 and the ca_cloudbase2_j25 template and have sections of code which are contained within the following tags:-

Code: Select all

<pre class="code-display"><span style="font-size: 1.2em !important;"><code>mydata$bmi &lt;- BMI_function(mydata$weight_kg, mydata$height_kg)</code></span></pre>
In the JCE Editor the display under the preview tab looks fine however when viewed in Chrome the font size of the code portion of the text is very small.

I am using the inline font definition and including the '!important' qualifier but this is not being interpreted.
The attached images show the result in the Preview of JCE and in the Chrome browser.

Any help would be appreciated.

Re: How to increase the font size within a <pre> and <code> tag

Posted: Wed Jun 12, 2019 9:22 am
by AMurray
Please note Joomla 2.5 is unsupported and it's advised to upgrade to 3.9.8.
Joomla! 2.5 - End of Life 31 Dec 2014

Please provide a link to the site, reading an excerpt screen-shot doesn't tell the whole story.

I believe, the small print is caused by the way you're using <pre>,<span> and <code> together and maybe they are conflicting with each other, not to mention your inline style for the font size.

Here's an explanation of the <pre> tag: I'm not an absolute expert at HTML but W3C is an excellent resource for learning it. (visit the site, and also look up the resource for <code> and <span> to may be get some tips there.

I'm not entirely sure what effect you're trying to achieve.

I would say, as the HTML is written, Chrome is displaying it as intended; how do other browsers display it?

Re: How to increase the font size within a <pre> and <code> tag

Posted: Wed Jun 12, 2019 4:52 pm
by GeoffArms48
AMurray - thanks for your comments

Joomla 2.5 is provided by my hosting company and that is the only version they offer so I have to work with that.

What I am trying to achieve is the code segment with larger font (12pt) than is shown.

The code that is generated is from the JCE Editor and views correctly in the JCE Preview window

You can see the display at the following link - ... lating-bmi


Re: How to increase the font size within a <pre> and <code> tag

Posted: Wed Jun 12, 2019 8:03 pm
by sozzled
GeoffArms48 wrote:
Wed Jun 12, 2019 4:52 pm
Joomla 2.5 is provided by my hosting company ...
What are you talking about? Joomla is provided from here:

Your hosting company may have some quickie installation script (e.g. Fantastico, Softalulous, and the like) and these so-called "quick installation" features that are provided by a number of webhosting providers may allow users to spend a few minutes to install [outdated and unsupported] versions of Joomla (or other CMS products) but ... so what? ???

It takes less than 10 minutes to install Joomla ... without relying on "quick installation" scripts offered by webhosting companies. Further, most of these "quick" installation packages are the causes of more problems than we can discuss here. So, rather than spending a few days arguing about whether to use a "quick installation" script, how about spending 10 minutes and install Joomla properly? :)

And, if people don't know how to install Joomla properly (i.e. without using these quickie installation packages), there are lots of tutorials and video presentations that show you how. It's really not that difficult.

I don't know any website owner who would seriously consider using software that was designed over 10 years ago to run a business. J! 2.5 is dead.