I am using Bootstrap 3 and I would like to add some buttons in panel header, on top-right corner. When trying to add them, they are show below title baseline.
Code : http://bootply.com/82631
What are the missing CSS I should add either to the title, panel heading, or buttons ?
I would start by adding clearfix
class to the <div>
with panel-heading
class. Then, add both panel-title
and pull-left
to the H4
tag. Then, add padding-top
, as necessary.
Here's the complete code:
<div class="panel panel-default">
<div class="panel-heading clearfix">
<h4 class="panel-title pull-left" style="padding-top: 7.5px;">Panel header</h4>
<div class="btn-group pull-right">
<a href="#" class="btn btn-default btn-sm">## Lock</a>
<a href="#" class="btn btn-default btn-sm">## Delete</a>
<a href="#" class="btn btn-default btn-sm">## Move</a>
</div>
</div>
...
</div>