How do I keep a title image (below the header) and a scrolling list beneath


#1

I am trying to display a page with header, title-image and a scrolling list below the title-image.

How would I setup the page-structure in Ionic, so the image sticks in it’s position and the list below scrolls. Here’s what I have:

        <ion-view title="Test">
          <ion-nav-buttons side="left">
            <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
         </ion-nav-buttons>
<!-- If I put the image here, it doesn't scroll, but gets covered by the content-->
          <ion-content class="has-header" has-header="true" has-subheader="true">
<!-- If I put the image here, it scrolls with the list-->
            <ion-list>
              <ion-item ng-repeat="itm in itms" href="#/app/itms/{{itm.id}}">
                {{itm.title}}
              </ion-item>
            </ion-list>
          </ion-content>
        </ion-view>

Do I need to do that in CSS or is there an ionic-way to set that up that?


#2

Some simple css should do the trick.