Ion-toggle size Ionic4

Hello,

I’m desperate to change the size of a toggle (width: 100%;). the handle is blocked. Does anyone have a solution?
thx

html

<ion-tabs>

  <ion-toolbar no-padding>
        <ion-grid class="grid">
          <ion-row>
            <ion-col text-center>
              <h3 *ngIf="toggleValue==false" class="left">Left</h3>
            </ion-col>
            <ion-col text-center>
                  <h3>
                    <ion-toggle class="toggle" [(ngModel)]="toggleValue"></ion-toggle>
                  </h3>
            </ion-col>
            <ion-col text-center>
              <h3 *ngIf="toggleValue!==false" class="right">Right</h3>
            </ion-col>
          </ion-row>
        </ion-grid>
  </ion-toolbar>

scss

.toggle{
  --background:#d33939;
  --background-checked:#10dc60;
  width: 100%;
}

share image of what kind of view you want

I put a toggle in ion-grid (with 3 ion-col). The toggle is in the center and I would like it to make 100% (width:100%) of the ion-col. The problem is that handle doesn’t slide from one side to the other.

toggle