Shouldn't <ion-tabs slot="top"> be under <ion-header>?

Hey all
I was working on the mobile version of an Ionic app and realized that when I used <ion-tabs slot="top"> the tab is appearing above the <ion-header>. Shouldn’t it be the under the <ion-header> or am I missing something?

I was checking out the starter tabs project, too and got the same result (see screenshot). Does somebody has some insight? Cheers!


if you want the tabs to be at the top then that’s how you would do it (or atleast how I would do it. I am not a 100% sure as to what you are implying. usually the html section will look something like:




the docs say that if the slot is set to “top” then it will be placed at the top of the screen. what outcome are you desiring?

I guess I get your point. I was just confused since the starter tabs project doesn’t make this apparent out of the box. I was looking for this behaviour:

where as the tab is right under the header. but I guess with a bit reconstruction this should be possible, too. Thank you, @ctfrancia for your reply!

Edit: I think I’l create a reproducable repo for this, since when trying out the normal way of doing this, the is overlapping the .

@zwacky Did you ever figure out how to do this? I have the same issue - many thanks!