离子卡中的离子卡全高

Question

我正在尝试使离子卡在离子滑片内响应。响应式网格在卡中起作用，但是当我添加离子滑片和离子滑片元素时，它没有。你知道我在想什么吗？我认为这可能与幻灯片没有继承的高度有关，但是我不知道该怎么做。在离子滑片或离子滑片中放入相同的离子卡CSS代码无济于事。

非常感谢您的提前帮助！

哈伦

HTML：

 <ion-slides>
<ion-slide>
  <ion-card>
      <ion-grid>
        <ion-row class="row1">
          <ion-col>
            ROW 1
          </ion-col>
        </ion-row>
        <ion-row class="row2">
          <ion-col>
            ROW 2
          </ion-col>
        </ion-row>
      </ion-grid>
    </ion-card>
</ion-slide>

CSS：

  ion-grid {
    height: 100%;
    padding: 0;
  }

  ion-card {
    height: 100%;
    padding: 0;
    display: flex;
    border: 3px solid green;
  }

  .row1 {
    height: 100%;
    flex: 1;
    border: 3px solid orange;
  }

  .row2 {
    height: 100%;
    flex: 2;
    border: 3px solid red;
  }