I'm trying to show rows and columns of thumbnail images.

I can easily (using .row and .col-md-1 etc.) get bootstrap to automatically set up rows of 12 thumbnails each. In a full-sized window it automatically wraps my more-than-12-thumbnails-in-a-row into rows of 12 each.

Unfortunately, when you squeeze the window down, instead of reducing the rows to 11 each, and then 10 each, and so on...it goes straight from 12 thumbs down to a single column of 1 thumb per row.

Am I doing it wrong? I tried making .col-md-6 groups of thumbs, hoping it would at least go down from 12 per row down to 6 per row (which I could live with), but strangely, it then gave me just 1 thumb per column (so it wound up with thumb, wide empty space, second thumb, then down to the next row...)

How can I organize these thumbs into rows and columns to make most effective use of whatever screen space is available?