Twitter Bootstrap Containers

Question

Ive been using bootstrap for a few months and am looking to clarify something as part of best practices.

My question is do I create a container for each row or just one big container for the whole page.

Example1 (Closed Containers)

<div class="container">
    <div class="row">
        <div class="span8 offest2">
            <h1>Content</h1>
        </div>
    </div>
</div>


<div class="container">
    <div class="row">
        <div class="span8 offest2">
            <h1>More Content</h1>
        </div>
    </div>
</div>

Example 2 (1 large container)

<div class="container">

    <div class="row">
        <div class="span8 offest2">
            <h1>Content</h1>
        </div>
    </div>

    <div class="row">
        <div class="span8 offest2">
            <h1>Content</h1>
        </div>
    </div>

</div>

Any help appreciated, just dont want to get into bad habits early on

Answer 1

I would recommend the second example. In the first you have duplicate code wich makes no real sense. Always think about the principle "Don't repeat yourself".

Answer 2

Multiple rows can logically be part of the same grid, like rows in a table. The .container represents one grid. So Example 2 would be the way to go.