I am using the new and amazing font Source Sans Pro as my base font (it really is that good quality and fed up of seeing Ariel every where).
My problem is that if for any reason the font-face doesn’t load and it reverts back to Ariel because of the change in font size this breaks my layout.
Is there anyway to resize the font so that this is the same size as Ariel?
I have tried using the: http://www.fontsquirrel.com/fontface/generator in Expert mode and selected the X-height Matching but this doesn’t work and nothing is downloaded it just loads forever.
a) Make sure it’s not going to be a problem. Why should the font fail?
b) Design your site to work with either font. Encase your headings (I assume this is the issue) with divs that define area better.
c) I’ve developed a jQuery plugin that determines whether a custom font has been loaded or not, which does this.
Demo: http://pulse-dev.com/files/stackoverflow/fontfacedelay/index3.htm