As a MVC developer I've been using Twitter Bootstrap for over a year to deliver responsive web designs. It gives me a massive head start on starting projects. By using Twitter Bootstrap I can reduce the Web Design cost for my clients to the point that we'll only engage a Web Designer for adding visual "icing to the cake" rather than building the site look and feel from the ground up.
Recently Twitter Bootstrap v3.0.0 was released and if you've upgraded your project you'll noticed the layout no longer works. This is mainly in part to the new grid system. Instead of span1 you now have col-lg-1 and so on. The new (and 100% fluid) Bootstrap 3 grid now comes in 4 sizes. Tiny (for smartphones .col-xs-*), Small (for tablets .col-sm-*), Medium (for laptops .col-md-*) and Large (for laptops/desktops .col-lg-*). The 3 grid sizes enable you to control grid behavior on different devices (desktop, laptops, tablet, smartphone, etc..).
Now you can go through the official Bootstrap migration guide and manually make all the changes required or you can do as I did and use a tool. I've found that the Bootply Migration Tool to be an awesome starting point for the conversion. They'll be still a bit of manually editing but this tool will give you a good head start.
For instance copy and pasting the following HTML snippet into the tool:
Then hit "Convert to Bootstrap 3" and voilà.
If you're a less addict like me you can Less mixins to migrate your grid.
The ‘old’ span* will not be the same as col-* or col-lg-*. So replacing the class names in your templates will be give you better results. You will find that the col-lg-* class is in place of the former span* class. This will give you a possibility to create a mixin for span* with the same styles as col-lg-* in this case.
