Have list item take all the height

@polska03 wrote:

I have a page which simply looks like this:

<ion-navbar *navbar>
  <ion-title>My List</ion-title>
</ion-navbar>

<ion-content class="has-header">
  <ion-list>
    <ion-item *ngFor="#item of items">
      <ion-toolbar>
        <ion-buttons end>
          <button>Something</button>
        </ion-buttons>
      </ion-toolbar>
      <img [src]="slide.image" class="slide-image"/>
      <h2 class="slide-title" [innerHTML]="slide.title"></h2>
      <p [innerHTML]="slide.description"></p>
    </ion-item>
  </ion-list>
</ion-content>

Let says there are 100 items. I would like each item to take the full height. So you should not be able to see the next or previous item at all unless you scroll. I would like the height of every item to be the same which would be the size of ion-content I guess. How can I do this? I have tried playing around with height, min-height, positioning, flex, but have not been able to make it work?

Cheers

Posts: 1

Participants: 1

Read full topic