Align 11 columns on bootstrap, how to deal with missing column? - twitter-bootstrap-3

Question

I have a grid with 11 columns
<div class="row">
<div class="col-lg-1">1</div>
<div class="col-lg-1">2</div>
<div class="col-lg-1">3</div>
<div class="col-lg-1">4</div>
<div class="col-lg-1">5</div>
<div class="col-lg-1">6</div>
<div class="col-lg-1">7</div>
<div class="col-lg-1">8</div>
<div class="col-lg-1">9</div>
<div class="col-lg-1">10</div>
<div class="col-lg-1">11</div>
</div>
My problem is that bootstrap works on 12 column grids, therefore the 12th column shows empty. (making the grid look non centered)
I want to center this grid so at the beginning of the grid there will be the space of half a column, and at the end of the grid it will show the other half:
<div class="row">
<div class="col-lg-1/2">1/2 blank</div>
<div class="col-lg-1">1</div>
<div class="col-lg-1">2</div>
<div class="col-lg-1">3</div>
<div class="col-lg-1">4</div>
<div class="col-lg-1">5</div>
<div class="col-lg-1">6</div>
<div class="col-lg-1">7</div>
<div class="col-lg-1">8</div>
<div class="col-lg-1">9</div>
<div class="col-lg-1">10</div>
<div class="col-lg-1">11</div>
<div class="col-lg-1/2">1/2 blank</div>
</div>
^ thats an example of how I imagine it will work, but unfortunately we dont have 1/2 columns on boostrap.

Answer 1

You could always create a half-size column to add into a supplemental style sheet (You'll want to make sure you account for all of the styling, though):
.col-lg-half {
width: 4.166666665%;
}
.col-lg-half
{
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
#media (min-width: 1200px) {
.col-lg-half {
float: left;
}
}
Then, what you are wanting should work.
<div class="row">
<div class="col-lg-half">1/2 blank</div>
<div class="col-lg-1">1</div>
<div class="col-lg-1">2</div>
<div class="col-lg-1">3</div>
<div class="col-lg-1">4</div>
<div class="col-lg-1">5</div>
<div class="col-lg-1">6</div>
<div class="col-lg-1">7</div>
<div class="col-lg-1">8</div>
<div class="col-lg-1">9</div>
<div class="col-lg-1">10</div>
<div class="col-lg-1">11</div>
<div class="col-lg-half">1/2 blank</div>
</div>