Layout error with multiple slider in the same page

Ionic Framework ionic-v3
1

Hi, I found an issue when i create two slider in the same page.

This is the code.

<!--
  Generated template for the Trymap page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>trymap</ion-title>
  </ion-navbar>

</ion-header>


<ion-content>
  <ion-grid>
    <ion-slides>
      <ion-slide>
        <h1>Slide 1</h1>
      </ion-slide>
      <ion-slide>
        <h1>Slide 2</h1>
      </ion-slide>
      <ion-slide>
        <h1>Slide 3</h1>
      </ion-slide>
    </ion-slides>
  </ion-grid>

  <ion-grid>
    <ion-slides>
      <ion-slide>
        <h1>Slide 1</h1>
      </ion-slide>
      <ion-slide>
        <h1>Slide 2</h1>
      </ion-slide>
      <ion-slide>
        <h1>Slide 3</h1>
      </ion-slide>
    </ion-slides>
  </ion-grid>
</ion-content>

And this is the result when i rotate the device.

PORTRAIT MODE:

image
image.png424×747 2.98 KB

LANDSCAPE MODE:
image

Only the second slide resize the width instead the first slide no!

Any solution?

2

Same issue here. Did you find any solution?

3

what exactly do you want to do?

4

As in the example, I have two slides. On portrait mode every is ok. Slides have 100% width. But on landscape mode the first slides are not resize to fill the whole width, and I see the second slide which is not activated. The second slides are ok, with 100% width.

5

i posted the issue on github