Going through @smichelotti’s Ionic2 course on PluralSight… using this snippet:
<ion-content padding>
<ion-list>
<ion-item-group *ngFor="let division of teams">
<ion-item-divider color="secondary">{{division.divisionName}}</ion-item-divider>
<button *ngFor="let team of division.divisionTeams" ion-item (click)="itemTapped($event, team)">
{{team.name}}
</button>
</ion-item-group>
</ion-list>
</ion-content>
In the video, this renders as (secondary coloration extends to screen edges):
But in my browser it renders as (seconday coloration restricted by ion-item-group width):
Ionic Framework: 2.0.0-rc.4
Ionic Native: 2.2.11
Ionic App Scripts: 0.0.47
Angular Core: 2.2.1
Angular Compiler CLI: 2.2.1
Node: 6.9.1
OS Platform: Linux 4.6
Navigator Platform: Linux x86_64
User Agent: Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.23 Mobile Safari/537.36
What’s the trick to get the secondary coloration of the ion-item-divider to extend to the edges of the screen?