1 Topic by Paul (edited by Paul 2005-04-19 12:21)

  • Paul
  • Senior Member
  • Offline
  • From: Wales, UK.
  • Registered: 2003-08-13
  • Posts: 3,089

Topic: PunBB Font Sizes

I'm writing this post because I have seen a number of attempts at integrating PunBB into a website where the end result was text too small to read in Internet Explorer.

Browsers other than Internet Explorer have their font-size set in pixels. The default size is 11px and is set in  Section 2.1 in the main stylesheet as follows:-

.pun {FONT-SIZE: 11px; LINE-HEIGHT: normal}

Unfortunately, Internet Explorer does not support text resizing if the font size in set in pixels. In order to accomplish text resizing in Internet Explorer it is fed a different font size which is also in Section 2.1 of the main stylesheet and is as follows:-

 /* IEWin Font Size only - to allow IEWin to zoom. Do not remove comments \*/
* HTML .pun {FONT-SIZE: 68.75%}
/* End IE Win Font Size */

The way it works it that the default font size used by Internet Explorer is 16px and 68.75% of 16px is 11px so Internet Explorer ends up with the same font size as other browsers. The comments together with the "* HTML" are all part of the hack which prevents other browsers from seeing this and should not be tampered with.

This all works fine until somebody goes and sets a different font size for body. What then happens is that Internet Explorer will calculate its font size for PunBB as 68.75% of the font size set for body. For example, if you set the font size for body at 11px then 68.75% of this is 7.56px which is too small to read.

When integrating PunBB into a site you must  be aware of the above and take account of it. If you have set the font size for body in pixels then you might as well just delete the special font size for Internet Explorer as you will have prevented text resizing anyway. If you have set the body font size either as a percentage or in em's then you need to adjust the percentage font size for Internet Explorer e.g. if you set your body font size to 68.75% then you would need * HTML .pun {font-size: 100%} to compensate. Of course, if you don't care about users being able to resize text then you can just delete the special font size for Internet Explorer and have done with it.

2 Reply by Mythology (edited by Mythology 2006-08-02 23:19)

  • From: London, England
  • Registered: 2006-06-27
  • Posts: 6

Re: PunBB Font Sizes

Thank you for that, Paul. smile

Not integrated into a website, but the slight problem I had with mine is that none of my members are youngsters with good eyesight and big monitors - the youngest will be 40 very shortly, I'm 55, and most of them are over 60.  Generally they find that using "Normal" text size (or "Medium" in IE)  is OK for the average web page but nearly all forums (not just PunBB) are too small for comfort.

So, to save them going up a size in their browser just for my forum, I had fished around (a lot of trial and error here - I'm new at this stuff!), found that first bit and changed the default size to 12px.   Result - everybody happy except for a few people who were using IE.

I hadn't spotted the second bit though (and probably wouldn't have cottoned on if I had) but by changing that from 68.75% to 75%, this has resulted in smiles from the IE users too.

3 Reply by Paul

  • Paul
  • Senior Member
  • Offline
  • From: Wales, UK.
  • Registered: 2003-08-13
  • Posts: 3,089

Re: PunBB Font Sizes

I know the problem. Six months ago I could read perfectly, now I need to either take my spectacles off (I'm short sighted) or move the book 2 feet away from my face. When I designed that stylesheet I was perfeclty comfortable with 11px but now I can't seem to cope with anything less than 12px.

  • Registered: 2006-10-17
  • Posts: 6

Re: PunBB Font Sizes

Ok, so if I'm using an external style sheet (CSS) to control my pun BB forum, where in this style sheet should i put the code to change WinIE's font size, and what exact code do I need??

Thanks in advance!

Robbie White | Senior Editor | westendworld.com

5 Reply by kensongoo (edited by kensongoo 2006-11-22 19:25)

  • Registered: 2006-11-22
  • Posts: 4

Re: PunBB Font Sizes

This is what i change so that the font-size can be adjusted in all browsers.

Phonenixrip, you change this the CSS in stylesheet file that you use. For example, i use Oxygen, so i edited the Oxygen.css file under style folder.


body{font-size: 62.5%}

.pun, .pun INPUT, .pun SELECT, .pun TEXTAREA, .pun OPTGROUP {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5em;
}

You can view what I did at my Cell Phone Forum.

  • Registered: 2006-12-26
  • Posts: 4

Re: PunBB Font Sizes

Thank you Paul smile

  • Registered: 2006-10-22
  • Posts: 31

Re: PunBB Font Sizes

I'm pretty sure this is not the case for IE7 (I refuse to update to that crap, though)... can someone confirm?

Check Maid maid service

CReatiVe4w3's Website

8 Reply by Paul

  • Paul
  • Senior Member
  • Offline
  • From: Wales, UK.
  • Registered: 2003-08-13
  • Posts: 3,089

Re: PunBB Font Sizes

As far as I know IE7 handles font resizing the same as IE6, that is, it cannot resize font sizes specified in pixels.

It does have a page zoom feature which tries (and fails) to mimic Opera by simply magnifying everything on the screen including text but thats not the same thing. What confuses the issue is using ctrl + scroll activates page zoom in IE7 whereas it used to activate text resizing. To resize text in IE7 you now have to use the menu.

  • Registered: 2009-06-09
  • Posts: 1

Re: PunBB Font Sizes

Same problem with IE 7.0
need to set Font size of your choice in

/* IEWin Font Size only - to allow IEWin to zoom. Do not remove comments \*/
* HTML .pun {FONT-SIZE: 68.75%}
/* End IE Win Font Size */


you can also use Font size of your size by putting the any value.

10 Reply by qie

  • qie
  • Senior Member
  • Offline
  • Registered: 2006-08-26
  • Posts: 185

Re: PunBB Font Sizes

i just set the font-size to : 14px; that will be better in sentivity.

石家庄电脑维修

qie's Website