paulirish/lazyweb-requests — Issue #51: CSS comparison tools
Author: akavlie
Created: 2012-02-09 03:27:37+00:00
State: open

A couple of dev tools that would be extremely useful for working with a big chunk of third-party CSS like Twitter Bootstrap. Does anything like this exist yet?

- Toggle an entire CSS file instantly, to compare a page with and without it. Webkit Dev Tools, Firebug etc. can do this with a single CSS rule... I want to toggle a whole file in the same way.
- See a diff in effective rules (after all other CSS is applied) between two CSS rules. Say I build a site with Twitter Bootstrap 2.0, and 6 months from now 3.0 is released with some features I want. But how do I get an overview of what will change if I upgrade? Comparing the two Bootstrap files alone doesn't give a complete picture, as much of my site-specific CSS may paper over the Bootstrap changes already.