On Sunday my brother and I rode the British Heart Foundations, London to Brighton Bike Ride. However, unlike most of the 30,000 cyclists rather than getting on a bus back to London we decided to ride all the way back to London. 107 miles covered, 7 hours in the saddle, and we still made it home for lunch.
For a brief history of font-stretch I would recommend reading an article by Mr Richard Rutter: Whatever happened to font-strech?. Playing with Firefox 3.6 it would seem some support for font-stretch has been introduced though. My problem lies however, with how it deals with font’s that are missing the required ‘stretch’.
Having read through a number of the bugs in the Mozilla and WebKit bug systems it would seem there has been a major hold back on releasing font-stretch till a solution that could ‘imitate’ the effect for people without the right variant of a font. This is great as shipping a solution that only works for a few people is never a good idea. Unfortunately, the support that exists in 3.6 is somewhat wonky and feels unfinished.
In my tests I have the variants of Helvetica Neue installed:
I do not have the variant Helvetica Neue Condensed Ultra Light. This is however the variant of the font I want the browser to try and use. So as a good little web developer I style this text:
<h1>Hello World</h1>
With the following style:
h1 {
font: 100 2em 'Helvetica Neue',sans-serif;
font-stretch: condensed;
}
This says using a font-weight of ‘ultra-light’, sized 2em, font face of Helvetica Neue if you have it any sans-serif font if you dont. Oh and can you try and make it have a condensed stretch. As Firefox 3.5 does not understand font stretch it ignores that line and renders the text as it knows best. Firefox 3.6 on the other hand understands that I would like a font-stretch of condensed. This should be good news right? I might get something pretty coming out the other end. This is what the rendered output actually looks like:
I have included the latest webkit nightly as a control, this is also how its rendered in every other browser I tested under.
WTF? Where did that come from? For some reason Firefox has decided that the font-stretch can out rank, and thus ignore, the font-weight. Font-weight a control that has worked for many many years. This is so frustratingly not even similar to what I wanted. I can’t work out if this is a bug or if this is indeed what the gecko developers actually would have expected to be rendered in this situation. In my opinion this is worse than no support. If font weight was the new control and we had stretch for ever I could comprehend this change.
So my tip: unless you are using @font-face or know for certain users have your font. Stick clear of font-stretch in css or have some rather unexpected outcomes.
“Offline Application Cache available in HTML5 is killer. However, it’s a giant PITA to debug, especially if you’re still trying to get your head around it.”
— Jonathan Stark - Debugging HTML 5 Offline Application Cache
“TextMate Bundle [that] adds text expansions for Google AJAX Libraries”
— koorb’s textmate-google-ajax-libraries-bundle. This just made me quite a lot happy.
