CSS Wie ein Element in Ionic zum Zentrum

Question

Ich bin mit Ionic3, und haben folgende:

Ich mag die Ion-Karte zum Zentrum auszurichten.

html

<div class="contracted-content"> 

    <ion-card class="job-card"> 

    ... 

    </ion-card> 

    <div class="person-job"> 
    <ion-row> 

     ... 

    </ion-row> 
    </div> 

</div> 

SCSS

.contracted-content { 
    max-width: 369px; 
    align-content: center;  
} 

Wie Sie sehen können, habe ich die maximale Breite auf 369px, so dass das Bild nicht verzerrt wird. Jetzt, wenn die Browserbreite über 369px hinaus erhöht wird, möchte ich das div zentrieren (das align-content: center; hat keinen Einfluss).

Jede Beratung geschätzt.

Answer 1

Versuchen Sie, margin: 0 auto; zu verwenden, um Ihr Element zu zentrieren

Answer 2

versuchen Sie dies:

DEMO HERE

CSS

.align-center{ 
display: inline-block; 
position: relative; 
left: 50%; 
webkit-transform: translateX(-50%); 
transform: translateX(-50%); 
} 

HTML

<ion-card class="job-card align-center"> 
... 
</ion-card>