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.

CSS

İlginizi Çekebilir

CSS list-style Kullanımı

CSS grid-row-gap Kullanımı

CSS stroke-width Kullanımı

CSS z-index Kullanımı

CSS background-position Kullanımı