CSS align-items Örnek

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <style> #anakutu { width: 220px; height: 350px; border: 2px solid black; display: -webkit-flex; -webkit-align-items: center; display: flex; align-items: center; } #anakutu div { -webkit-flex: 1; flex: 1; color:white; font-weight:bold; } </style> </head> <body> <div id="anakutu"> <div style="background-color:red;">Kutu</div> <div style="background-color:green;">Kutu</div> <div style="background-color:blue;">Kutu</div> <div style="background-color:gray;">Kutu</div> <div style="background-color:black;">Kutu</div> <div style="background-color:pink;">Kutu</div> </div> <article><b>Hatırlatma:</b> Internet Explorer 10 ve önceki versiyonlar align-items özelliğini desteklemiyor.</article> <article><b>Hatırlatma:</b> Safari 7.0 ve sonrasındaki sürümleri -webkit-align-items özelliğini destekliyor.Tüm tarayıcılar bu komutu standart kabul edene kadar -webkit ön takısı kullanılmalıdır.</article> </body> </html>

Yorumlar

Popüler yayınlar

CSS content Özelliği

CSS justify-content Özelliği

CSS top Özelliği

Javascript ile neler yapılabilir

HTML strong Etiketi

Kriptopara nasıl alınır ve nereden alınır?

Ücretsiz Bitcoin Kazan Pasif Gelir Elde Et İnternetten Para Kazan

Javascript Oyun Yapma Dersleri HTML5+CSS3

CSS align-self özelliği

HTML5 Canvas Oyun Yapımı Dersleri