html - ionic - 离子行内容未正确显示

Question

在 Ionic 项目的 html 文件中，我有一个ion-grid三行。第一个包含地图，第二个包含列表，第三个包含按钮。问题是第二行的内容没有显示在任何地方。

这是html代码：

 <ion-grid>
<ion-row>
<div class="map-container">
  <div id="map">
  </div>
</div> 
 </ion-row>

 <ion-row>
<ion-list>
  <p>
    Prova
  </p>
  <p>
      Prova
    </p>
    <p>
        Prova
      </p>
</ion-list>
</ion-row>

<ion-row>
<button ion-button color="primary" block (click)='planTrip()' id="button_plan"> Pianifica il tuo percorso </button>
</ion-row>
 </ion-grid>

这是CSS：

#map{
width: 100%; 
height:92%; 
position: fixed;
}

#prova{
  position:fixed;
}

#button_plan{
  position: fixed;
  bottom: 0;
  width: 100%; 
  margin-bottom: 0px;
}