Cluster ve boşluk

Amaç: İki düğmeyi grid kullanmadan yan yana koymak ve boşluğun nereden geldiğini anlamak.
Süre: 3 dakika
Gerekenler: Bir sayfa ve birkaç küçük blok

Adımlar

  1. Add Block seçin, ardından Cluster seçin.
  2. Bir Name verin, sonra dizilimi ayarlayın: Justify, Align, Gap, Wrap ve Width.
  3. Cluster satırında Add child block seçin ve öğeleri ekleyin — örneğin iki Button Link.
  4. Kaydedin ve sonucu geniş pencerede olduğu kadar dar pencerede de kontrol edin.
Cluster block form showing name, width, justify, align, wrap, and gap.
Public page showing two buttons side by side in a centred cluster.

Boşluk aslında nereden gelir

Bir sayfadaki havayı dört blok denetler ve yanlışına uzanmak, uslu durmayan bir yerleşimin olağan sebebidir:

  • Section — Spacing. Bir içerik şeridinin üstündeki ve altındaki dikey boşluk. Büyük olan budur.
  • Container — Flow. stack, container'ın çocuklarını eşit aralıklarla ayırır; none onları olduğu gibi bırakır.
  • Grid — Gap. Izgara hücreleri arasındaki boşluk.
  • Cluster — Gap. Bir satırdaki öğeler arasındaki boşluk.

İki paragraf birbirine fazla yakın duruyorsa yanıt Container'ın flow'udur, boş bir Plain Text bloğu değil.

Notlar

  • Boşluk için asla boş blok eklemeyin. Biri sayfayı telefonda düzenleyene kadar hayatta kalır ve ekran okuyucuya boş bir paragraf gibi okunur.
  • Wrap: nowrap bir satırı her genişlikte tek satırda tutar; iki düğme için doğru, altı etiket için yanlıştır. Tereddüt ederseniz sarmasına izin verin.
  • Cluster, bir satırdaki birkaç küçük öğe içindir. Yan yana duracak asli içerik için Columns ya da Grid kullanın.
  • Cluster aynı zamanda gezinme çubuklarının ve kart alt bölgelerinin içinde duran şeydir; Shared Slot'larda karşınıza çıkmasının sebebi de budur.
Sıradaki: Card, Feature Grid ve Stat Card