Objekte in meiner Kategorie Seite sind nicht vertikal ausgerichtet

Question

Ich habe eine Seite, wo ich die Produktkategorien auflisten. Diese Seite listet visuelle Kategorien und Kategorienamen auf. Kategoriebild und Kategoriename sind jedoch nicht vertikal ausgerichtet. Ich möchte diese beiden Objekte für jede Bildschirmgröße vertikal ausrichten. Vielen Dank. My categories page picture Codes:

<ion-item [hidden]="!anaListeGoster" *ngFor="let list of anaKategoriListesi" (tap)="kodYakala(list.OZELKOD, list.ACIKLAMA, list.ID)"> 
 
    <div class="resimKutusu"> 
 
     <img class="kategoriResimleri" [src]="'xx.com.xx.com'+list.OZELKOD+'.jpg'"> 
 
    </div> 
 
    <span class="aciklamaYazisi"> {{ aciklamaKisalt(list.ACIKLAMA) }} </span> 
 
    <ion-icon class="devamEtIcon" name="ios-arrow-forward" item-end></ion-icon> 
 
</ion-item>

.resimKutusu{ 
 
    float: left; 
 
    width:50px; 
 
    height: 50px; 
 
    text-align: center !important; 
 
    border-radius: 50%; 
 
    overflow: hidden; 
 

 
    
 
} 
 
.kategoriResimleri{ 
 
    min-width: 50px; 
 
    max-width: none; 
 
    height: 50px; 
 
    
 
} 
 
.aciklamaYazisi{ 
 
    font-size:16px; 
 
    position: absolute; 
 
    margin-top : 5%; 
 
    margin-left: 3%; 
 
}

Answer 1

.resimKutusu { 
    display: content; 
    float: left; 
    width:50px; 
    height: 50px; 
    text-align: center !important; 
    border-radius: 50%; 
    overflow: hidden; 
}