CSS flex

flex :

Bir div içinde bazı divlerimiz var diyelim.Bunları width height vermeden hepsini içine sığacak şekilde sığdırabiliriz.İstersek genişliklerini de değiştirebiliriz. Ama bunda height hep sonuna kadar iner.Bir nevi alanı tablo gibi özellikler sağlıyor.

Örnek

.flex{
    display: -webkit-flex; /* Safari */
    display: flex;
    width: 300px;
    background: red;
    padding: 10px;
    color: white;
}

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
flex-grow Flex-grow divlerin boyutlandırmasını yapar.Değer olarak sayıları alır.
flex-basis Flex-basis de flex-grow gibi boyutlandırma yapar,ama bu px gibi değer alarak yapar.
flex-shrink Flex-shrink değeri kadar o element diğerlerine göre fazladan daralacaktır.Varsayılan değeri 1 dir
auto ayarı 1 1 e otomatik olarak ayarlar.
none ayarı 0 0 a otomatik olarak ayarlar.
İnital
İnherit

Tarayıcı Desteği

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

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir