Tag

align-items

Browsing

CSS hemen hemen her programlama dili gibi yıllardır durmaksızın geliştiriliyor. Bu yazımda Flex modülü ile gelmiş olan 2 özelliği nasıl kullanabileceğimizden bahsedeceğim. Flex modülü hizalama ve bölümlendirme üzerine çok büyük yeniliklerle geldi. Bunlardan 2’si de justify-content ve align-items özellikleri. Bu iki özellik, nesnelerin yatay ve dikeyde nasıl hizalanacaklarını belirler. justify-content Flex özelliğine sahip olan bir kapsayıcının yatay eksende nasıl hizalanacağını ayarlar. Objeler başta mı, ortada mı, sonda mı, aralıklı mı dizileceğine karar vermemizi sağlar. Bu kararı vermek için 5 parametre kullanır: flex-start: Nesneler kapsayıcının başından başlayarak dizilirler. space-around: Nesneler arasında eşit boşluklar bırakılır. space-between: İlk nesne başta, son nesne sonda olacak şekilde nesneler eşit olarak kapsayıcının içerisinde dizilirler. center: Nesneler tam ortalı olacak şekilde hizalanır. flex-end: Son nesne en sağa yaslanacak şekilde hizalanır. align-items Bu…