Can I put content inside a row in bootstrap 3's grid?

Question

I'm building a layout where many rows will span the entire containing column. I'm wondering if I should nest a col-12 inside each of these rows and put content in there or if I should just put the content inside the row?

So, is this OK:

<div class="row">
  <div class="my-lazy-content"></div>
</div>

Or, is it better to put a column in there too:

<div class="row">
  <div class="col-xs-12">
    <div class="my-verbose-content></div>
  </div>
</div>

Answer 1

If you want the content to span the entire column, you should add in the col-xs-12 wrapping div around your content. This ensures that the content has that 15px of padding to the left and right and doesn't simply "hard-align" to the edges of the row element since the row class has negative -15px of margin to compensate for the container's 15px padding?

Is it absolutely necessary to have the rows? If the content simply spans the entire width of the container, why not just nest your content directly within the container as follows:

<div class="container">
    <div class="content-wrapper">
    </div>
</div>