CSS justify-content

justify-content :

Elementleri ana obje içerisinde yatay olarak hizalanmasını sağlar.

Örnek

#justify {
    width: 300px;
    height: 200px;
    display: -webkit-flex; /* Safari */
    -webkit-justify-content: space-around; /* Safari 6.1+ */
    display: flex;
    justify-content: space-around;
}

#justify div {
    width: 100px;
    height: 100px;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
flex-start Elementler ana objenin başında konumlandırılmıştır
flex-end Elementler ana objenin sonunda konumlandırılmıştır.
center Elementler ana objenin ortasında konumlandırılmıştır.
space-between Elementler ana objenin kenarlarından hizalanır
space-around Elementler kenarlara bitişik olmayacak şekilde hizalanır.
İnital
İnherit

Tarayıcı Desteği

29.0
21.0-webkit
28.0
18.0-moz
11.0 6.1-webkit 12.10