Comment puis-je désactiver padding sur div alors que le contenu ionique a un remplissage sur Ionic 3

Question

J'ai le code suivant. Ma page a un remplissage mais je veux enlever le remplissage sur le conteneur div. J'essaye no-padding ou no-padding!important mais cela ne fonctionne pas.

Comment puis-je résoudre ce problème? Merci.

<ion-content padding no-bounce> 

    <div class="boxContainer"> 
    <div class="box"> 
     <ion-grid text-center> 
     <ion-row> 
      <ion-col width-33> 
      ... 
      </ion-col> 
     </ion-row> 
     <ion-row> 
      <ion-col width-33> 
      ... 
      </ion-col> 
     </ion-row> 
     <ion-row> 
      <ion-col width-33> 
      ... 
      </ion-col> 
     </ion-row> 
     </ion-grid> 
    </div> 
    </div> 

</ion-content> 

Answer 1

SOLUTION

Je ne peux pas résoudre ce comme je veux mais trouvé de cette façon.

Je retire le rembourrage du rembourrage ionique. Et ajouté les autres divs sauf la boîte un. Par exemple.

<ion-content no-bounce> 

    <div class="boxContainer" padding-top=""> 
    <div class="box"> 
     <ion-grid text-center> 
     <ion-row> 
      <ion-col width-33> 
      <p class="walletTextParag">Cüzdanınız:</p> 
      </ion-col> 
     </ion-row> 
     <ion-row> 
      <ion-col width-33> 
      <h1 class="walletText">{{ (profileData | async)?.wallet}} ₺</h1> 
      </ion-col> 
     </ion-row> 
     <ion-row> 
      <ion-col width-50> 
      <button class="walletButton" ion-button="" icon-left color="color1" (click)="seePaymentsArchive()"> 
       <ion-icon name="ios-calendar"></ion-icon> 
       Ödeme geçmişi 
      </button> 
      </ion-col> 
     </ion-row> 
     </ion-grid> 
    </div> 
    </div> 
</ion-content> 

Vous pouvez ajouter padding les autres divs facilement comme

<div padding> 
</div> 

Answer 2

Vous pouvez utiliser des attributs tels que <div no-padding > </div> ou vous pouvez essayer ci-dessous le code

ion-content .boxContainer.box 
    { 
    padding: 0 
    } 

S'il vous plaît suivre ci-dessous le lien pour plus pris en charge les attributs ioniques Ionic website link

Answer 3

Vous devez remplacer le css qui est appliqué par ionique sur les éléments que vous voulez avoir pas paddi ng Par exemple, si la classe ajoutée par ionique est box, ajoutez une classe personnalisée, par exemple no-padding et remplacez le remplissage défini dans une règle CSS plus spécifique dans votre fichier css personnalisé.

Quelque chose comme:

div.box.no-padding { 
    padding: 0 !important; 
} 

Vous pourriez même pas besoin d'ajouter !important tag si ionique n'utilise pas !important dans la classe box