 <p>Move <code>ion-footer-bar</code> should be outside of <code>ion-content</code> will solve your issue.</p> <p><strong>Markup</strong></p> <pre><code>&lt;ion-popover-view&gt; &lt;ion-header-bar&gt; &lt;h1 class="title"&gt;Show Columns&lt;/h1&gt; &lt;/ion-header-bar&gt; &lt;ion-content&gt; ..content here &lt;/ion-content&gt; &lt;ion-footer-bar&gt; &lt;button ng-click="closePopover()"&gt;close&lt;/button&gt; &lt;/ion-footer-bar&gt; &lt;/ion-popover-view&gt; </code></pre> <p><a href="http://plnkr.co/edit/Nuyxa09XtHmjFwMTTNXU?p=preview" rel="nofollow"><strong>Demo</strong></a></p>