Compiling Bootstrap from LESS, missing rules

Question

I'm compiling Bootstrap from the latest LESS files so I can override/add my own variables (mostly colours).

However the compiled css file doesn't contain any of the .span3, .span8 rules, does anyone know how/where these rules are generated?

Downloading the latest pre-compiled css files works fine - these contain the above rules.
I've tried a search on the LESS files, but only the table rules were found (.tableColumns(3), .tableColumns(8) etc..).

My current bootstrap.less looks like:

@import "@{BootStrapVer}/variables.less";
@import "@{Custom}/custom-vars.less";
@import "@{BootStrapVer}/mixins.less";

<Rest of bootstrap less files excluded for brevity>

everything is right here: github.com/twitter/bootstrap/tree/master/less — Scott Simpson
@ScottSimpson - I've downloaded the LESS files from github and my bootstrap.less references them all, but once compiled my bootstrap.css is smaller than the pre-compiled one — SteB
Your bootstrap.less looks exactly like this? github.com/twitter/bootstrap/blob/master/less/bootstrap.less Maybe it is how you are compiling. If you are on Mac, try CodeKit for compiling. — Scott Simpson

David Taiaroa David Taiaroa · Accepted Answer · 2013-06-23T14:38:11

If I understand your description correctly, you are wanting a single, standalone CSS file which includes both the Bootstrap defaults plus your customisation.

Start by getting a copy of the less files from https://github.com/twitter/bootstrap/archive/master.zip

If you open boostrap.less you will see that towards the top there is

// Core variables and mixins
@import "variables.less"; // Modify this for custom colors, font-sizes, etc
@import "mixins.less";
....

add a statement calling your custom variable file in the middle of this block, being sure to get the relative path correct. Eg

// Core variables and mixins
@import "variables.less"; // Modify this for custom colors, font-sizes, etc  
@import "../../relative/path-to/custom-vars.less";
@import "mixins.less";

Then compile bootsrap.less.

I agree with @ScottSimpson, CodeKit is a good Mac option.

good luck!

Compiling Bootstrap from LESS, missing rules

2 Answers