Ion-slides inside ion-slides

I have ion-slides inside ion-slides the top one is vertical and the second one is horisontal. How can i do it correctly? Because right now it is not working.

if it gets to horisontal it stops to scroll to vertical again.

<ion-content >

<ion-slides direction=“vertical”>

<ion-slide>

<h1>Slide 1</h1>

</ion-slide>

<ion-slide>

<ion-slides >

<ion-slide>

<h1>Slide 2.1</h1>

</ion-slide>

<ion-slide>

<h1>Slide 2.2</h1>

</ion-slide>

<ion-slide>

<h1>Slide 2.3</h1>

</ion-slide>

</ion-slides>

</ion-slide>

<ion-slide>

<h1>Slide 3</h1>

</ion-slide>

</ion-slides>

</ion-content>