Skip to main content
Cartoon drawing of a man with a grey beard and glasses.

coofdy.com

Martin Kenny's website

Refactoring CSS - the need for a testing tool

Several times over the last couple of weeks, I've found myself refactoring CSS — making changes to simplify and group rules, but with the aim of not changing the appearance at all. To test my work, I've been taking screen shots and swapping backwards and forwards to look for differences.

It suddenly struck me that what I really need is a CSS/HTML-specific diff tool. One that can take some CSS and some specific HTML, work out all the borders, margins, placements, etc. for the combination, and save them in some format that I can easily compare. As a first cut, it wouldn't need to understand browser quirks, but it would need to understand all the cascade rules.

Maybe such a thing exists, but I haven't come across it, yet.