Ion-content "fullscreen" property not working

Ionic Framework ionic-v3
1

Greetings.
i’m trying to make the transparent header with the fullscreen content (so the content must be visible “under” the header).

For some reason it seems like fullscreen property is simply now working.

here is the html:

<ion-header no-border>
   <!--<nav-header-text [title]="item.itemTitle" [isTransparent]="true"></nav-header-text>-->
  <ion-navbar color='light' transparent>
    <ion-title left>
      Title Here
    </ion-title>
  </ion-navbar>
</ion-header>


<ion-content fullscreen>
  <ion-slides pager="true" zoom="true">
    <ion-slide *ngFor="let img of item.itemImages">
      <s3-image [imgName]="img" [imgType]="imgType.Active"></s3-image>
    </ion-slide>
  </ion-slides>
</ion-content>

and thats how it shown.

ba4e1-clip-56kb
ba4e1-clip-56kb.jpg787×657 52.3 KB

Apparently, the content is not fullscreen.
What am i doing wrong?
(same method as mentioned here https://yannbraga.com/2017/03/16/how-to-transparent-header-ionic2/)

2

Start by loosing color=‘light’ attribute. Since this probably undoes your transparency setting.

3

tried, changed nothing.

4

the only solution i came up with is (padding-top was set to 36px by default):

  //ion-content[fullscreen] bug fix
  .scroll-content {
    padding-top: 0px !important;
  }

i suppose it’s an ionic 3.6.0 bug.

5

Faced this issue too. Your workaround does the trick for now.

Is a bug already filed for this?