CODEWITHSUNDEEP
twitter-bootstrappanelgutter
Mohammad Saberi
Mohammad Saberi

Reputation: 13166

No gutter between 2 bootstrap 3.x panel

I need to have 2 panel in Bootstrap 3.x horizontally. I added the normal codes like this:

<div class="panel panel-default col-md-6">
    <div class="panel-heading">Heading</div>
    <div class="panel-body">
        Something ...
    </div>
</div>
<div class="panel panel-default col-md-6">
    <div class="panel-heading">Heading</div>
    <div class="panel-body">
        Something ...
    </div>
</div>

But there is no gutter between these 2 panel and they appear like this:

Captured image How can I solve this problem?

Upvotes: 0

Views: 77

Answers (1)

David Taiaroa
David Taiaroa

Reputation: 25495

What about making the panels children on the bootstrap columns?
https://codepen.io/panchroma/pen/MVomeX 

<div class="col-md-6">
 <div class="panel panel-default">
    <div class="panel-heading">Heading</div>
    <div class="panel-body">
        Something ...
    </div>
  </div>
</div>
<div class="col-md-6">
  <div class="panel panel-default">
    <div class="panel-heading">Heading</div>
    <div class="panel-body">
        Something ...
    </div>
  </div>
</div>

Upvotes: 1

Related Questions