Problem: page with subheader ,ion-list and footer

ionic-v1
1

Hi All,

I have a screen in my app which has the following tags in the same order

  1. Header

  2. Sub header

  3. Ion-list

  4. Footer

    "

       <div class="tabs tabs-top tabs-virtual"class="bar-subheader">
 
               <a href class="tab-item disable-user-behavior"
                   ng-class="{active: active_content=='details'}" ng-click="setActiveContent('details')">
                     <div class="buttons" >
             <button class="button button-outline button-positive">Details</button>
              </div>
              </a>
           <a href class="tab-item disable-user-behavior"
               ng-class="{active: active_content=='notes'}" ng-click="setActiveContent('notes')">
              <div class="buttons" >
               <button class="button button-outline button-positive">Notes</button>
            </div>
           </a>
   </div>
 
   <ion-content class="has-subheader" padding="true"  ng-show="active_content=='details'">
            <!-- detail page -->
              <div>
                  <ion-list>
                      <ion-item   ng-repeat="title in titles" >
                           <p><b>{{title}}</b> {{values[$index]}}</p>
                    </ion-item>
                </ion-list>
            </div>
  </ion-content >
 
   <ion-footer-bar class="bar-stable" ng-show="active_content=='details'" >
              <div class="buttons" ng-click="alarmAcknowlegde()">
                <button class="button button-clear button-positive">Acknowlegde</button>
             </div>
               <h1 class="title"><!-- to align other button on right side  --></h1>
               <div class="buttons" ng-click="alarmClear()" side="right">
             <button class="button button-clear button-positive">Clear</button>
              </div>
 </ion-footer-bar>
 
 </ion-view>

Problem : Footer is attached to subheader on the top
Please help
Thanks in Advance

2

3

Fixed the issue by using <ion-header-bar> for sub header