Skip to content

Place Self

Pintasan untuk align-self dan justify-self

Sintaks

layout="place-self:[value]"

Nilai

NilaiCSS OutputHuraian
autoplace-self: autoJajar automatik
startplace-self: startJajar permulaan
endplace-self: endJajar hujung
centerplace-self: centerJajar tengah
stretchplace-self: stretchRegangkan item

Contoh

html
<div layout="place-self:center">Centered item</div>

Pratonton

Letakkan Kendiri Tengah

layout="place-self:center" - Tengahkan satu item dalam kedua-dua arah dalam selnya

DefaultcenterDefault
Lihat Kod
html
<div layout="grid grid-cols:3" space="g:small p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium" style="height: 100px;">
  <span space="p:small" visual="bg:neutral-300 dark:bg:neutral-700 text:neutral-800 dark:text:neutral-200 rounded:small">Default</span>
  <span layout="place-self:center" space="p:small" visual="bg:primary text:white rounded:small">center</span>
  <span space="p:small" visual="bg:neutral-300 dark:bg:neutral-700 text:neutral-800 dark:text:neutral-200 rounded:small">Default</span>
</div>