Background Origin
Set background positioning origin
Syntax
visual="bg-origin:[value]"Values
| Value | CSS Output | Description |
|---|---|---|
border | background-origin: border-box | Origin at border |
padding | background-origin: padding-box | Origin at padding |
content | background-origin: content-box | Origin at content |
Examples
html
<div visual="bg-origin:content">Content origin</div>Preview
Background Origin
visual="bg-origin:content" - Set background positioning origin
border
padding
content
View Code
html
<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
<div space="p:small" visual="bg:primary text:white rounded:small">border</div>
<div space="p:small" visual="bg:primary text:white rounded:small">padding</div>
<div space="p:small" visual="bg:primary text:white rounded:small">content</div>
</div>