Section ve Container: sayfa genişliğini denetleyin

Amaç: Metnin büyük ekranda baştan sona uzamasını durdurmak ve bir içerik şeridine kendi nefes alanını vermek.
Süre: 3 dakika
Gerekenler: Main slotu olan bir sayfa

1. Main slotunda Add Block seçin, ardından Section seçin.
2. Bir Name verin. Bu yalnızca yönetim tarafındaki bir etikettir; blok listesinde bölümleri ayırt edebilesiniz diye vardır — ziyaretçiler onu hiç görmez.
3. Şeridin çevresindeki dikey boşluk için Spacing ayarlayın ve bölüm gerektiriyorsa Background Position ile Overlay kullanarak bir arka plan görseli ekleyin.
4. Blok listesinde Section satırında Add child block seçin ve Container seçin.
5. Width ayarlayın — sm'den xl'e ya da full — ve Flow seçin. stack, çocukları eşit aralıklarla ayırır; none onlara dokunmaz.
6. İçerik bloklarınızı Container'ın çocukları olarak ekleyin.

Section yatay şerittir. Kenardan kenara uzanır, arka planı taşır ve üstündeki ile altındaki boşluğun sahibidir.

Container onun içinde durur ve içeriğin ne kadar geniş olabileceğine karar verir.

Tam genişlikte bir fotoğrafın, hâlâ rahat okunan bir metin sütununun arkasında durabilmesi bu ayrım sayesindedir.

• Uzun satırlar zor okunur. 60-75 karakter civarı rahat aralıktır; dar genişlikler bunun içindir. full, paragraflar için değil görsellik ve yerleşim içindir.
• Yerleşim bloklarındaki Name alanı yalnızca yönetim tarafındadır. Onu kullanın — hepsinin adı "Section" olan beş Section'lık bir blok listesi kimseye yardım etmez.
• Container'sız bir Section geçerlidir ve bazen doğrudur, ama o zaman metniniz ekran kadar geniş olur.
• İç içelik, üst bloğun satırındaki Add child block ile yapılır; üst seviyeye bir blok ekleyip umut ederek değil.