CSS justify-items Kullanımı
CSS "justify-items" özelliği, CSS Grid layout sisteminde bir grid hücresinin içindeki öğelerin yatay olarak nasıl pozisyonlandırılacağını belirler. Bu özellik, grid hücresindeki öğelerin yatay olarak nereye yerleştirileceğini kontrol etmek için kullanılabilir.
Örnek kullanım aşağıdadır..
.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
justify-items: center;
}
Bu örnekte, 3 sütunlu bir grid oluşturulmuş ve "justify-items" özelliği ile grid hücresindeki tüm öğeler yatay olarak merkeze hizalanmıştır.
"justify-items" özelliği aşağıdaki değerler alabilir..
- start: öğeler sola hizalanır.
- end: öğeler sağa hizalanır.
- center: öğeler ortaya hizalanır.
- stretch: öğeler grid hücresinin tam genişliğine ulaşır.
- baseline: öğeler metin taban çizgisi üzerine hizalanır.