Как выровнять по центру ион-слайды по содержанию ионов?

Question

У меня есть страница с ионными слайдами:

<ion-content padding>

    <ion-slides pager="true">
        <ion-slide class="step-one">
            <h1>Welcome</h1>
            <p>Lorem ipsum dolor sit amet, massa nam ante. Vel lacus viverra volutpat tortor ligula ornare, varius ut mauris ipsum mus torquent, scelerisque suspendisse penatibus, purus et arcu ipsum vehicula quam luctus. Consectetuer sed urna accumsan. Nec viverra felis varius pretium, volutpat in et cras, odio consectetuer lacinia risus feugiat sit etiam, commodo pulvinar, dolor non et inventore.</p>
            <p>  </p> <!-- TODO: figure out how to add spacing properly -->
        </ion-slide>

        <ion-slide class="step-two">
            <h1>Heading</h1>
            <p>blah, blah</p>
        </ion-slide>

        <ion-slide class="step-three">
            <h1>Heading</h1>
            <p>blah, blah</p>

            <ion-button (click)='finish()'>FINISH!</ion-button>
        </ion-slide>
    </ion-slides>

</ion-content>

Как я могу вертикально центрировать ионный слайд? В настоящее время он находится вверху страницы.

Answer 1

Решением для меня было добавить этот CSS:

.slides {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    height: 100%;
}