Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS Refactoring Best Practice

we are working on a large web application with Rails for quite a while and produced a lot of css for our templates. Stylesheet definitions are organised in a bunch of css files that have grown with the project. As people are not always as disciplined as they should be, it seems to me that a lot of definitions have become deprecated and useless.

Is there an (semi-)automatic way to get rid of this stuff? How do you identify useless css in your project?

like image 772
auralbee Avatar asked May 03 '26 05:05

auralbee


2 Answers

You can use the Dust-Me Selectors plugin for Firefox or the CSS redundancy checker.

Both are great tools that I use often and they save you hours of searching and deleting.

Another tool worth making note of also is the CSS Tidy open source project. This minifies your CSS, especially useful in these cases when you have a huge site with a huge CSS file :)


I believe the sourcecode for the CSS Redundancy checker can be found here. Ran it through the JSLint plugin at jsFiddle.net but gave me some errors, saved it for everyone here.

like image 168
Kyle Avatar answered May 05 '26 18:05

Kyle


Not exactly a 'rails' solution but you don't always need one. I use the Dust-Me Selectors firefox plugin to find unused selectors. Works for me.

edit: kyle beat me to it

like image 25
re5et Avatar answered May 05 '26 19:05

re5et