CODEWITHSUNDEEP
twitter-bootstraptwitter-bootstrap-3
msek
msek

Reputation: 3

Twitter Boostrap 3 RC1 - more than 12 columns?

I am trying to achieve 24-column grid in Bootstrap RC1, I've tried changing @grid-columns to 24 in variables.less, but it doesn't seem to work.

After I compile bootstrap.less, I get this:

  .col-lg-1 {
    width: 4.166666666666666%;
  }
  .col-lg-2 {
    width: 8.333333333333332%;
  }
  .col-lg-3 {
    width: 12.5%;
  }
  .col-lg-4 {
    width: 16.666666666666664%;
  }
  .col-lg-5 {
    width: 20.833333333333336%;
  }
  .col-lg-6 {
    width: 25%;
  }
  .col-lg-7 {
    width: 29.166666666666668%;
  }
  .col-lg-8 {
    width: 33.33333333333333%;
  }
  .col-lg-9 {
    width: 37.5%;
  }
  .col-lg-10 {
    width: 41.66666666666667%;
  }
  .col-lg-11 {
    width: 45.83333333333333%;
  }
  .col-lg-12 {
    width: 100%;
  }

So basically columns 1 to 11 are calculated correctly, but it ends on column 12 which seems to be hard-coded to be 100%.

Am I doing something wrong? Does BS3 support more than 12 columns?

Upvotes: 0

Views: 716

Answers (2)

Tom
Tom

Reputation: 3656

Unobtrusive option: http://tmaiaroto.github.io/gridline/ ... Plop that in and use data attributes to adjust the number of columns on the fly and row by row.

Upvotes: 0

user247702
user247702

Reputation: 24212

You also need to edit grid.less, it's hardcoded for 12 columns. Looping is possible in LESS, so I don't know why the Bootstrap developers aren't using it, but perhaps they have a good reason. You could open an issue on GitHub and see what they have to say.

Upvotes: 1

Related Questions