GPU text rendering in webkit

No Comments

Webkit will render an element differently when the responsibility of painting it is passed from the CPU to the GPU. This switch can trigger unintended rendering artefacts which, although most obvious in text, apply to all types of content. Changes in antialiasing With the exception of IE11, every browser I tested uses subpixel antialiasing on… Continue Reading

Posted in: CSS

Google Analytics Debugger 2

No Comments

A new open source version of Google Analytics Debugger is available on github. This is a complete rewrite of the original Firefox-only add-on with new features including support for Universal Analytics. Contribute on Github For the moment only a Chrome version exists in the repository but extensions for Firefox and hopefully other browsers will come… Continue Reading

JS1K 2014: Thrust

No Comments

This year I decided to write something for JS1K. My entry is based on a game from my childhood called Thrust. The basic premise of the game is to navigate a ship down into a cavernous planet, retrieve a pod and escape with it back to space. Play Thrust at JS1K The original game featured… Continue Reading

Targeting first and last rows in CSS grid layouts

4 Comments

I was recently asked is it possible to select every element in the last row of a grid containing an arbitrary number of items using CSS selectors? Not wanting to shy away from a challenge, I started hacking and found a solution which I’ve written up along with a few other techniques for targeting elements… Continue Reading

Posted in: CSS

Google Analytics Debugger for Firefox Update

No Comments

I’ve released a small update to my Google Analytics Debugger add-on for Firefox. This post details the latest changes. Download the Add-on HTTPS support GA Debugger now tracks data over HTTPS connections. The previous release only intercepted __utm.gif requests to http://www.google-analytics.com/. The progress listener interface now listens for requests to https://ssl.google-analytics.com too, allowing you monitor… Continue Reading

The state of CSS 3D transforms

3 Comments

If you follow me on twitter you’ll know I’ve been experimenting with CSS 3D transforms to see how far I can push them. A while back I wrote a very simple first person demo built using HTML, CSS3 and a splash of JavaScript. The 3D enviroment was constructed entirely from <div> elements that were positioned… Continue Reading

Posted in: CSS

Moving IE specific CSS into @media blocks

8 Comments

Here’s an alternative method for writing IE specific style rules without having to move them into separate files. The idea is to put your IE styles into a @media block that will only be applied in certain versions of IE. I discovered this trick while looking for a way to write a media query pass-through… Continue Reading

Posted in: CSS

Working with elements before the DOM is ready

5 Comments

I’ve been looking into ways to modify elements before DOMContentLoaded so that enhancements can be made as an element is rendered to the screen allowing users to begin interacting with a page even if it hasn’t finished loading or if rendering is being blocked by 3rd party assets such as banner ads or tracking code…. Continue Reading