How to add scrolling to an ion-slides component (so I can scroll U/D and page L/R)

I am new to ionic programming. I am trying to figure out to get my ion-slides component to scroll up and down (as well as page left and right – working)

Below is the UI (notice how the bottom is cut off)

HpXsl274×608 61.2 KB

This my html code:

<ion-header>
  <app-toolbar-header [toolbarMeta]="toolbarMeta"></app-toolbar-header>
</ion-header>

<ion-content class="ion-padding" scrollbar="true">
  <app-connectivity-status></app-connectivity-status>

  <ion-slides pager="true">
    <ion-slide *ngFor="let e of evacNotice">
      <ion-list *ngIf="e.hideOrShow">
        <img [src]="e.icon" alt="" class="page-image">
        <ion-item class="ion-text-wrap text-import">
          <div style="overflow-y: auto;" [innerHTML]="sanitizeAndUnescapeHtml(e.body)"></div>
        </ion-item>
      </ion-list>
    </ion-slide>
  </ion-slides>
</ion-content>

This is my .css

 ion-slides {
    height: 95% !important;
  }

Note: I haven’t included the .ts file as its nut programming logic, not relevant to the UI layout.

I have looked at various site for help (Scroll to top in ionic), but nothing seems to work.

Any ideas

7 posts - 2 participants

Read full topic