List underneath tabs


#1

I’ currently using tabs for navigation and on a particular view I’m showing a list of items. This used to work fine till I’ve added the ion-side-menu for adding sort / filter capabilities to the list.

Till then, the last few list icons are displayed underneath the tabs :frowning:
I’m using the following code:

Parent view defining the tabs

<ion-tabs class="tabs-dark tabs-icon-top">
    <ion-tab href="#/contacts/people" title="Kontakte" icon-on="ion-ios7-person" icon-off="ion-ios7-person-outline">
        <ion-nav-view name="contacts"></ion-nav-view>
</ion-tab>

Child view containing the list and the side-menus

<ion-view>
    <ion-side-menus>
        <ion-side-menu side="left" class="has-subheader">
        ...
        </ion-side-menu>

        <ion-side-menu-content class="has-subheader">
            <ion-content>
                <ion-list>
                    <ion-refresher ...></ion-refresher>

                    <ion-item ...>
                    ...
                    </ion-item>

                    <ion-infinite-scroll ...></ion-infinite-scroll>
                </ion-list>
            </ion-content>
        </ion-side-menu-content>
    </ion-side-menus>
</ion-view>

#2

We’ll you shouldn’t need to add the has-header to the side-menu items. ion-content should automatically update and adjust for the tabs and header.

Can you provide codepen example? I wasn’t able to reproduce it.