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 assume that twitter bootstrap heavily relies on those span* classes. When I only toggle the "table" checkbox under "Base CSS", I still get span* classes in the compiled css, because they are rendered anyway. Take a look at https://github.com/twitter/bootstrap/blob/master/less/tables.less:

// R.185: Change the column widths to account for td/th padding
.table td,
.table th {
  &.span1     { .tableColumns(1); }
  &.span2     { .tableColumns(2); }
  &.span3     { .tableColumns(3); }
  &.span4     { .tableColumns(4); }
  &.span5     { .tableColumns(5); }
  &.span6     { .tableColumns(6); }
  &.span7     { .tableColumns(7); }
  &.span8     { .tableColumns(8); }
  &.span9     { .tableColumns(9); }
  &.span10    { .tableColumns(10); }
  &.span11    { .tableColumns(11); }
  &.span12    { .tableColumns(12); }
}

So I'm afraid you should cannot remove them with the customizer, only manually.