Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Ionic 2 Popover: Toolbar within ion-header or ion-footer doesn't stay fixed
See original GitHub issueIn a scrollable Popover (content size is larger than the window of the popover), a <ion-toolbar> within <ion-header> or <ion-footer> scrolls together with the content.
The toolbar should stay fixed on its relative position (top resp. bottom).
Popover template (with title and button to close):
<ion-header>
<ion-toolbar>
<ion-title>{{name}}</ion-title>
<ion-buttons right>
<button (click)="closeInfo()">
<ion-icon name="close"></ion-icon>
</button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content>
<p [innerHtml]="description"></p>
</ion-content>
Tested with Ionic 2 beta.10 on Android and Chrome browser.
Your system information:
Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.10
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
OS:
Node Version: v5.11.1
Issue Analytics
- State:
- Created 7 years ago
- Reactions:2
- Comments:9 (1 by maintainers)
Top Results From Across the Web
Popover: Toolbar within ion-header doesn't stay fixed
To accomplish this I placed the ion-toolbar within an ion-header tag, which should make it stay fixed in its location (as stated by...
Read more >Ionic 2 Popover: Toolbar within ion-header or ion-footer doesn ...
The toolbar should stay fixed on its relative position (top resp. bot. ... Ionic 2 Popover: Toolbar within ion-header or ion-footer doesn't ...
Read more >Popover: Toolbar within ion-header doesn't stay fixed - ionic-v3
The toolbar always scrolls together with the content of the popover page (the same issue is with a ion-footer tag below the content).Tested...
Read more >How to Customise Ionic 6 Modal and Popover - YouTube
In Ionic 6 the styling of modals and popovers has changed, because they are now using Shadow DOM. Follow this quick win to...
Read more >5 Examples of the new Ionic 6 Bottom Sheet Modal
<ion-header> <ion-toolbar> <ion-title>Modal Content</ion-title> ... doesn't cover your whole screen, reacting to changes made in the modal ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Any update for this bug??
Looks like it has not been fixed yet. Any idea if is in the plans?