CSS Esnek Kutusu
1
2
3
4
5
6
7
8
CSS Flexbox Düzen Modülü
Flexbox Düzen modülünden önce dört düzen modu vardı:
- Bir web sayfasındaki bölümler için engelle
- Metin için satır içi
- Tablo, iki boyutlu tablo verileri için
- Konumlandırılmış, bir öğenin açık konumu için
Esnek Kutu Düzen Modülü, kayan nokta veya konumlandırma kullanmadan esnek, duyarlı düzen yapısı tasarlamayı kolaylaştırır.
Tarayıcı Desteği
Flexbox özellikleri tüm modern tarayıcılarda desteklenir.
| 29.0 | 11.0 | 22.0 | 10 | 48 |
Flexbox Elemanları
Flexbox modelini kullanmaya başlamak için önce bir esnek kap tanımlamanız gerekir.
1
2
3
Yukarıdaki öğe, üç esnek öğeye sahip esnek bir kapsayıcıyı (mavi alan) temsil eder.
Örnek
Üç esnek öğeye sahip bir esnek kap:
<div
class="flex-container">
<div>1</div>
<div>2</div>
<div>3</div>
</div>
Sonraki bölümlerde esnek kaplar ve esnek öğeler hakkında daha fazla bilgi edineceksiniz.