How to remove unused styles from twitter bootstrap?

Question

My bootstrap stylesheet size is around 120kb.

But I\'m only using 25% of that stylesheet code.

I don\'t want that span* class. I tried it by customizing it in

Answer 1

I have a template using Bootstrap 2, which is the required system for Joomla. I just did this manually and found it easy to do. The Bootstrap CSS file is very nicely constructed and well ordered in sections. I removed the entire contents of the file to bootstrap_unused.css and then also copied that to bootstrap_original.css.

I then cut out from bootstrap_unused.css what I knew was in use, being careful to preserve the order, and pasted it back in. Most of it worked first time and reduced the file size from 144KB to 14KB. I then needed to add some bits and pieces back in for forms etc. and ended up at 30KB.

If I need any other features in the future, I can pull them back in from bootstrap_unused.css and I always have bootstrap_original.css for reference.