Ionic-framework: Fix ion-content or how to set ion-content has non scrollable (new feature or how to if already exists)

Created on 2 Feb 2017 · 4Comments · Source: ionic-team/ionic-framework

Ionic version: (check one with "x")
[X ] 2.x

I'm submitting a ... (check one with "x")
[X ] feature request

Current behavior:
I'm not able to fix my ion-content elements, each of them become scrollable.

I tried to use attribute "disable-scroll" on ion-content, no effect (saw that on the forum https://forum.ionicframework.com/t/scroll-false-in-ionic-2/64571/9)

I tried ion-fixed (as discussed there https://github.com/driftyco/ionic/issues/5987), isn't recognize anymore.

Expected behavior:
I would like to be able to set an ion-content element as non scrollable

Related code:

<ion-content>
   <!-- stuffs non scrollable -->
</ion-content>

Other information:
Following tickets got in the same direction: https://github.com/driftyco/ionic/issues/9110

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Your system information:

Cordova CLI: 6.5.0
Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: 1.9.0
ios-sim version: 5.0.13
OS: macOS Sierra
Node Version: v7.2.1
Xcode version: Xcode 8.2.1 Build version 8C1002

Source

peterpeterparker

Most helpful comment

Sorry solved:

<ion-content>
    <div ion-fixed>
        <!-- stuffs non scrollable -->
    </div>
</ion-content>

and a css line to add width 100% to [ion-fixed]

peterpeterparker on 2 Feb 2017

👍8 🎉7

All 4 comments

Sorry solved:

<ion-content>
    <div ion-fixed>
        <!-- stuffs non scrollable -->
    </div>
</ion-content>

and a css line to add width 100% to [ion-fixed]

peterpeterparker on 2 Feb 2017

👍8 🎉7

@peterpeterparker I did this but my div still scrolls with other content. Is this only thing you did to make it non scrollable?

viveksinha9 on 5 Jan 2018

@viveksinha9 I don't reckon exactly because this issue is kind of almost one year old ;)

according my code, furthermore to adding the attribute ion-fixed to the div I have also added following piece of css

[ion-fixed] {
    height: 100%;
}

I hope this help

peterpeterparker on 5 Jan 2018

👍2

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.