Nested ion-content and scrolling

Here is my template’s structure:

<ion-content>
  <someelement></someelement>
  <ion-content>
     <ion-segment></ion-segment>
     <ion-content></ion-content>
  </ion-content>
</ion-content>

I’m nesting ion-content because I wanted sub content sections to be able to scroll on their own instead of scrolling along with the outmost ion-content. This however doesn’t work as I expect, although nested ion-content became scrollable, but their height seems to expand to a percentage of the hosted content, the end result is that scrolling in child ion-content only leads to a part of the full content, then it has to move the parent ion-content.

I tried ion-scroll, but it requires a predetermined height which in my case isn’t practical because the outside content is unpredictable. Is there a way to achieve the desired scroll somehow?

Thanks.

1 Like