Mastodon
Back to home

Trouble with @font-face Thickness in WebKit.

While Webkits default subpixel-antialiased type looks good in many cases, if you’re using a font service like Typekit many of those fonts tend to render thick in Webkit. In my opinion WebKit’s text rendering is too thick and bloated by default. This is usually a problem that can be fixed by applying the following webkit vendor-prefixed property as mentioned in a blog post by Max Voltar:

-webkit-font-smoothing: antialiased;
                

We recently ran into a situation where we were using @font-face to include a custom font in a mobile website we were developing. The type was still rendering thick even after we tried common fixes like applying a text-shadow to text and the -webkit-font-smoothing fix mentioned above. The solution was to apply a 3D transformation of 0px to the elements that we’re too thick.

-webkit-transform: translate3d(0px, 0px, 0px);
                

The image above shows the before and after results when this rule is applied. By applying this rule to our CSS it also eliminates the “pop” you get when animating the element. The end result gave us consistent font rendering across all webkit browsers.

February 27, 2012

How to strip a project of all hidden .svn files.

More often then I’d like to admit I need to strip an entire project of it’s SVN folders and files. Instead of going in each folder individually, I use this useful terminal command.

cd /some/of/your/folders/
                rm -rf `find . -type d -name .svn`
                
April 20, 2011

Switching Keys For Values In PHP Arrays

February 2006:

I recently discovered the need to search an array for a value using PHP. The problem with the array_search() function is that it takes the value and an array as arguments and returns the key of the value found. Instead I had the key and needed to return the value. The problem was easily solved with the array_flip() function. The array_flip() function switches the key with the value. This allowed me to use the array_search() functions to retrieve the values I wanted.

$sample = array('key' => 'value');
                $sample = array_flip($sample);
                $sample_value = array_search('key', $sample);
                /* Will Return = 'value' */
                
February 21, 2011
Related Tags