Style Ionic Toggle and Ionic Label


#1

I would like to style an ion-toggle like in the picture. I need a label and I need a toggle.
This is like a row with two columns, in the left column there is the label and in the right column there is the toggle. The columns should be both 50% and the content of the columns should be in the center. Like the picture.

My problem is, the ion-toggle is on the right site and ion-label have about 80% of the width, and i can not center them.
Some ideas? Here simple code for ion-item with ion-label and ion-toggle

<ion-item>
    <ion-label>OFF</ion-label>
    <ion-toggle [checked]="false" color="secondary"></ion-toggle>
</ion-item>

I also tried to do something like that:

<ion-grid>
    <ion-row>
        <ion-col width-50 text-center>Off</ion-col>
        <ion-col width-50 text-center>
            <ion-item>
                <ion-toggle [checked]="false" color="secondary"></ion-toggle>
            </ion-item>
        </ion-col>
    </ion-row>
<ion-grid>

But the problem here is, the column with the toggle keeps also the needed space for the ion-label, so the toggle is always on the right site.