user4493177
user4493177

Reputation: 790

div between container and row in bootstrap

I want to wrap a group of rows in bootstrap while still having everything in one container. Are there any rules/conventions about this regarding bootstrap?

I put a fiddle below of what i want to do, but i am not sure if this is the right method.

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="extraDiv" id="topdiv">
    <div class="row">
      <div class="col-md-12">Bla</div>
    </div>
    <div class="row">
      <div class="col-md-6">Bla</div>
      <div class="col-md-6">Bla</div>
    </div>
  </div>
  <div class="extraDiv" id="bottomdiv">
    <div class="row">
      <div class="col-md-12">Bla</div>
    </div>
  </div>
</div>

Upvotes: 0

Views: 1549

Answers (2)

Matt Wilson
Matt Wilson

Reputation: 8319

Seems fine - though it depends what you want to do with the gutters etc.

Generally you just want one .container wrapping the whole page (to give you the main central column), and within that you can nest as many rows/cols as you need to.

Upvotes: 1

Husain Ahmmed
Husain Ahmmed

Reputation: 351

As far my understanding it is totally okay the way you use .row class in a .container class. For further understanding you can check this link Must Bootstrap container elements include row elements?

Upvotes: 1

Related Questions