There are roughly 3 ways to make grid systems: float
inline-block
table-cell
They all have PROs and CONs. Bootstrap probably uses float
because, being a framework, it adapts easily to different scenarios.
A big limit of the float
method is that you can't vertically align grid elements, and personally I prefer using the inline-block
method.
However, the inline-block
method brings a problem of whitespace (because the grid items become kind of words) which can be fixed in various ways, as extensively explained by Chris Coyier:
http://css-tricks.com/fighting-the-space-between-inline-block-elements/
The biggest problem with the table-cell
method is, in my opinion, that you can only place grid elements in one row because you can't push them on a new line via CSS. This means that for each row you need a new container element, and it becomes very inflexible for responsive designs.