İş birliği ve reklam için: info@metinpolat.net
Bir şeyleri ortalamak, CSS’nin en zor yönlerinden biridir.
Ortalama yöntemleri genellikle anlaşılması zor değildir. Bunun nedeni, ortalama yapmanın pek çok yolu olduğu gerçeğinden kaynaklanıyor.
Kullandığınız yöntem, ortalamaya çalıştığınız HTML öğesine veya onu yatay veya dikey olarak ortalamanıza bağlı olarak değişebilir.
Bu yazıda, farklı öğelerin yatay, dikey ve hem dikey hem de yatay olarak nasıl ortalanacağının üzerinden geçeceğiz.
Css ile Yatay Olarak Nasıl Ortalanır
Elemanları yatay olarak ortalamak, genellikle dikey olarak ortalamaktan daha kolaydır. Burada, yatay olarak ortalamak isteyebileceğiniz bazı genel öğeler ve bunu yapmanın farklı yolları vardır.
Css ile yazıları yatay olarak ortalamak için, metin hizalama özelliğini text-align:center kodunu yazarak kullanmanız yeterlidir:
|
1 2 3 4 5 6 7 |
<div class="container"> <p>Örnek yazı</p> </div> p { text-align: center; } |
Css ile Div Nasıl Ortalanır
Yatay olarak bir div gibi blok düzeyindeki öğeleri ortalamak için 0 değerine sahip margin özelliğini kullanın:
|
1 2 3 4 5 6 7 |
<div class="container"> <div class="ortala">Bu div yatay olarak ortalandı</div> </div> .ortala { margin: 0 auto; } |
Bu şekilde ortala sınıfına yazdığımız css kodu ile divimizi yatay olarak ortalayabiliriz.