Ion-tabs and hide-nav-bar leaves space, with top 0px also

0
votes

I wanted to hide the nav-bar on a view within tabs(ion-tab)

Have tried top:0 on .tabs also and hide-nav-bar also

Apparently in ion-view if i use hide-nav-bar it leaves space befor the tabs and making it to top:0px (.tabs { top: 0 !important; }) leaves space between content and tabs

see image below

When using hide-nav-bar on ion-view:

enter image description here

With .tabs { top: 0 !important; }:

enter image description here

However , nav bar hides on tabs bottom and there is no space when it on bottom, is there any solution to hide nav-bar without leaving any space

1
cssionic-framework
does you ion-content have the class 'has-header' or 'padding'? - Jess Patton
no,this has now been solved :) - A.B

1 Answers

2
votes

Solved now, wanted to share this

This was because of the .has-tabs-top class that was being added to the ion-content element.

added this along with hide-nav-bar in view and .tabs { top: 0 !important; }

.has-tabs-top {
  top: 49px !important; /*  height of the tabs */
}