I’m getting confused about the various options in the twitter bootstrap grid, and how they go together.
To begin with, you can have an ordinary fixed container
, or a container-fluid
.
Then either one can include either an ordinary row
, or a fluid row, row-fluid
. That is, you can have a fixed container with a fluid row, or a container-fluid… with a fixed row?
Then on top of that, you can include the ‘responsive’ media queries, or not.
I am getting confused as to how these things interact. But let’s start with one obvious example.
On the examples page itself, there’s what’s presented as an example of both a fixed grid and a fluid grid
However, in my browser, on that example page itself — both grids behave identically. Perhaps because the example page uses the optional responsive media queries? In both grid examples, if I start gradually narrowing my browser window, the grid elements do not get gradually narrower — once a certain (responsive) boundary width is reached, they snap to a smaller size, and again at further boundary widths. But both the ordinary ‘fixed’ example AND the ‘fluid’ example behave exactly the same here — so what the heck is the difference?