Ion-fixed is being overlapped by scrollable content

Ionic Framework ionic-v3
1

I’m using the ion-fixed directive for my ion-segment to ensure that it doesn’t leave the screen as the content below it scrolls. However, it seems that the rest of the content in the view are not respecting the ion-segment’s height…

Screenshot:
Ion-segment being overlapped by content.

HTML:

<ion-segment [(ngModel)]="option" ion-fixed padding>
    <ion-segment-button value="latest">LATEST</ion-segment-button>
    <ion-segment-button value="categories">CATEGORIES</ion-segment-button>
  </ion-segment>

  <div [ngSwitch]="option">
    ...

How do I keep the scrollable content from overlapping the fixed content?