Question

I have the following layout, using Twitter Bootstrap:

<div class="row">
    <div class="span8">
        <div class="row">
            <div class="span2"><img src="..."></div>
            <div class="span2"><img src="..."></div>
            <div class="span2"><img src="..."></div>
            <div class="span2"><img src="..."></div>
        </div>
    </div>

    <div class="span4">
        ...
    </div>
</div>

When I need to display more than 4 <img>, I can just create another row.
But I’ve noticed that when I use more than 4 span2 inside the span8, even without creating another row, it correctly splits them across several lines, rendering the same as if I had manually added the extra rows.

Is this a documented practice, or is it just working incidentally, and could have drawbacks in some situations / with some browsers?

Answer 1

It’s OK and it’s documented. Take a look at thumbnails section of the docs, you’ll see an example of this practice.
By the way, if you are showing a collection of images you should be using thumbnails.

EDIT:
Despite of everything, there’s a known issue when doing this inside a row-fluid. So there’s only support for static content right now.