<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row mm-top"> <div class="col-md-4"> <div class="panel panel-default"> <div class="panel-heading">Ejemplo de titulo</div> <div class="panel-body"> Ejemplo de Panel </div> </div> </div> <div class="col-sm-4"> <div class="panel panel-primary"> <div class="panel-heading"><h3 class="panel-title">Otro ejemlo de titulo</h3></div> <div class="panel-body"> <div class="well well-sm"> otro ejemplo de contenido </div> Esto es un ejemplo de <span class="label label-danger">codigo</span> </div> <div class="panel-footer">Footer del panel</div> </div> </div> <div class="col-sm-4"> <div class="panel panel-success"> <div class="panel-heading">Enviar por Correo</div> <div class="panel-body"> <div class="form-group"> <label>Ingrese los correos separados por (,)coma</label> </div> <div class="form-group"> <input type="text" class="form-control" placeholder="ingrese el texto a buscar."> </div> <input type="button" value="Buscar" class="btn btn-success pull-right"> </div> </div> </div> </div> </div>

.mm-top{ margin-top: 20px; }