Multiple panels with css

In this sample we are using bootstrap panel and modified css. This can be used as a standard panel in your website


Edit in plnkr

  <div class="row">
     <div id="first" class="col-md-3 col-xs-3">
        <div  class="panel panel-default">
          <div class="panel-heading">
                  <h4>Heading 1</h4>
            </div>
          <div class="panel-body">Body 1
            <table> 
                <tr>
                   <td>body 2 <br> </td>
                  
                </tr>
            </table>
          </div>
          <div class="panel-footer">
            <input type="button" value="Submit" class="btn btn-primary">
            <input type="button" value="Stop" class="btn btn-primary">
          </div>
        </div>
     </div>
      <div id="second" class="col-md-3 ">
        <div class="panel panel-default">
          <div class="panel-heading">
                <h4>Heading 2</h4>
          </div>
          <div class="panel-body">Body 2
            <table> 
                <tr>
                   <td>body 2 </td>
                 
                </tr>
            </table>
          </div>
          <div class="panel-footer">
            <input type="button" value="Submit" class="btn btn-primary">
            <input type="button" value="Stop" class="btn btn-primary">
          </div>
        </div>
    </div>
  </div>

CSS

#first{
 top:50%;
}

table{
    margin:0 auto;
}
.panel-heading{
 text-align: center;
 background-color: #fff
}
.panel-footer{
 text-align: center;
 background-color: #fff
}
.panel-body{
 text-align: center;
 background-color: #fff
}
h4{
    color:#ccc;
}