离子3：滚动条

Question

我正在使用Ionic 3，并且正在尝试提供滚动的segements栏，

<ion-content padding>
  <div padding>
    <ion-segment [(ngModel)]="kittens">
      <ion-segment-button value="kittens">
        Kittens
      </ion-segment-button>
      <ion-segment-button value="puppies">
        Puppies
      </ion-segment-button>
      <ion-segment-button value="puppies">
        Puppies
      </ion-segment-button>
      <ion-segment-button value="puppies">
        Puppies
      </ion-segment-button>
      <ion-segment-button value="puppies">
        Puppies
      </ion-segment-button>
      <ion-segment-button value="puppies">
        Puppies
      </ion-segment-button>
      <ion-segment-button value="puppies">
        Puppies
      </ion-segment-button>                  
    </ion-segment>
  </div>
</ion-content>

如图所示，segements栏不是滚动的而是变得越来越紧密。