Home/ Questions/Q 6668161
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T03:00:38+00:00

I’m having some major differences in the rendering of text between Chrome and Firefox.

  • 0

I’m having some major differences in the rendering of text between Chrome and Firefox. Chrome seems to apply some anti-aliasing rules to the text and shrinks it down quite a bit.

I’ve tried playing with -webkit-font-smoothing, letter-spacing and word-spacing but none seem to really have any effect.

See screenshots

Rendering on Chrome

Relevant CSS (computed): 

color: #C4C4C4;
font-family: sans-serif;
font-size: 9px;
font-style: normal;
font-variant: normal;
font-weight: normal;

Rendering on Firefox

Relevant CSS (computed): 

font-family:    sans-serif;
font-size:  9px;
font-weight:    400;
font-style: normal;
font-size-adjust:   none
color:  #C4C4C4;
text-transform: none;
text-decoration:    none;
letter-spacing: normal;
word-spacing:   0;
line-height:    11.0833px;
text-align: start;
vertical-align: baseline;
direction:  ltr;

Note that the faded text in the background is just an image.. ignore that.

I have a feeling Chrome has a css switch for anti-aliasing rules, but not sure where to look for more info.

Edit:

jsfiddle: http://jsfiddle.net/mHzhQ/

For the record, I’m on Ubuntu. Possibly this has an impact ..

Any tips?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Different browsers use different rendering engines that (are meant to) produce different results. This is especially the case with smaller font sizes. There’s generally not a whole lot you can do about it. If the difference is not intended by the browser’s designers, it’s also quite possible that this is a kink that has been worked out on other OSs, but not yours (Ubuntu).

    (That said: have you checked your “minimum font size” in Chrome — Preferences > Under the Hood > Customize Fonts… — and Firefox — Preferences > Content?)

    • 0