Yalnızca birkaç CSS kuralıyla, web esnekliğine sahip, baskıdan ilham alan bir düzen oluşturabilirsiniz. Bu bir gazete almak gibidir, ancak kağıt küçüldükçe, sütunlar otomatik olarak ayarlanır ve dengelenerek içeriğin doğal bir şekilde akmasına izin verir.
.intro ( columns: 300px 2; )columnsMülkiyet kabul edecek column-count, column-widthya da her ikisi özellikleri.
columns: || ;Her ikisinin de kullanılması column-countve column-widthesnek bir çok sütunlu düzen oluşturmak için önerilir. column-countİse, sütun sayısı olarak hareket edecek column-widthher sütun için minimum genişliğini belirleyecektir. Bu özellikleri bir araya getirdiğinizde, çok sütunlu düzen, medya sorgularına veya diğer kurallara gerek kalmadan, dar tarayıcı genişliklerinde otomatik olarak tek bir sütuna bölünür.
Çok sütunlu bir düzen, esnek bir gezinme yapmak için listeler dahil olmak üzere blok öğelerinde harika çalışır.
Çok sütunlu düzeninizde daha fazla ince ayar yapmak için break-inside, belirli öğeleri kullanarak bunların sütunlar arasında sıkışmasını önleyin.
Daha fazla bilgi
- CSS Çok Sütunlu Yerleşim Modülü Seviye 1 (Çalışma Taslağı)
- MDN Belgeleri
Tarayıcı desteği
| IE | Kenar | Firefox | Krom | Safari | Opera |
|---|---|---|---|---|---|
| 10+ | Herşey | 9+ | 50+ | Herşey | 11.5+ |
| Android Chrome | Android Firefox | Android Tarayıcı | iOS Safari | Opera Mobile |
|---|---|---|---|---|
| Herşey | Herşey | Herşey | Herşey | Herşey |