How to make panel-heading fixed with Bootstrap?

Question

I have this Bootstrap structure:

<div class="panel panel-default" style="height:450px;overflow-y:auto">
  <div class="panel-heading">
    <h3 class="panel-title">{% trans "News" %}</h3>
  </div>
  <div class="panel-body" style="padding:0;border:0px;">
  </div>
</div>

When I scroll the div panel-heading will not stay fixed as I want it to. How do I accomplish that?

Answer 1

Just put overflow-y parametr in panel-body instead of in whole panel div:

<div class="panel panel-default">
  <div class="panel-heading">
    <h3 class="panel-title">{% trans "News" %}</h3>
  </div>
  <div class="panel-body" style="padding:0;border:0px;height:450px;overflow-y:auto">
  </div>
</div>