Comment faire de l'espace entre 2 divs dans Ionic

Question

Je dois laisser de l'espace en haut et en bas de l'image pour qu'elle soit centrée et que le col ionique soit vers le bas.

<ion-content [fullscreen]="true" class="bg-class" text-center>

  <ion-img src="assets/icon/moon_logo.png" style="width:80%; margin: auto;">
  </ion-img>

  <ion-col>
    <div style=" margin: auto; padding-bottom: 15px;">
      <ion-button expand="block" style="--background:white; color: #1B0B50;">Login</ion-button>
    </div>
    <div style="margin: auto;">
      <ion-button expand="block">Get Started</ion-button>
    </div>
    <ion-row style="justify-content: center;">
      <p style="color: #576898; font-size: 12px;">Privacy Policy</p>

      <p style="color: #576898; font-size: 12px; padding-left: 20px;">Terms Of Use</p>
    </ion-row>
  </ion-col>

</ion-content>

Résultats d'affichage attendus

Answer 1

Tout d’abord, utilisez ion-col dans ion-row et ion-row dans ion-grid, sinon vous verrez des résultats inattendus. Il existe désormais de nombreuses solutions, l'une consiste à utiliser flex et flex-grow :

  

    

    
    
    
    

    
    
      ...