Consilience Media » monospace http://www.consil.co.uk Thu, 12 Jan 2012 12:03:04 +0000 en hourly 1 http://wordpress.org/?v=3.3 Accessible font sizes http://www.consil.co.uk/blog/2008/12/29/font-sizes/ http://www.consil.co.uk/blog/2008/12/29/font-sizes/#comments Mon, 29 Dec 2008 10:06:59 +0000 Phill Brown http://www.consil.co.uk/blog/?p=288 ...]]> font-sizes-29dec081A quick note to developers that are styling elements that use monospace fonts (pre, code, q, etc). Be aware that some browsers, like Safari and Chrome, have their own fixed-width font size preference, which by default is set to 13px. This upsets proceedings when you apply a proportional (% or em) font-size to the body.

There are three solutions to counter this problem:

  1. Apply font-size to each element separately
  2. Remove monospace from the font stack and treat it as a variable spaced font
  3. Use a fixed font size

Firefox and Internet Explorer have a single default font size so you can’t apply a larger size to monospace elements.

On the same subject, Google Chrome users can also set different default sizes for their serif and sans-serif fonts. By default these are identical so it will not affect the styling for the majority of users.

]]> http://www.consil.co.uk/blog/2008/12/29/font-sizes/feed/ 0