Inner ion-content becomes invisible when controller is attached


I try to add two lists side-by-side (something similar to what was done in this topic Two Lists side by side). But, as soon as I add controller to body all inner ion-content disappears. Here is codepen:, just rename controller and everything will show up as supposed to. What am I doing wrong?

Thank you,

I can not image that nesting ion-contents is the right way to do that…

Use ion-scroll tag if you want to have scrollable lists in the ion content.

Thank you for such a prompt response. I kind of thought that it doesn’t make sense to have more than one ion-content on a page at the same time, but once I start using ion-scroll I get another problem - it scrolls down while you’re holding the list and then bounces back (just try to add more entries to the list here: and you will see this weird behavior).

You have to set a fixed height :wink:

Thank you! It works perfect now!