Mixins
margin
Shorthand for set nullable margin properties.
Some values can be omitted using
null (preferable) or its alias n.Arguments
| Name | Type | Default | Description |
|---|---|---|---|
| $values * | list | — | Margin values list in default order (top-right-bottom-left). |
Example
@use 'more-sass' as more;
.element-one {
@include more.margin(10px);
}
.element-two {
@include more.margin(10px 20px 30px 40px); // or: @include more.margin(10px, 20px, 30px, 40px);
}
.element-three {
@include more.margin(null auto);
}
.element-one {
margin-block-start: 10px;
margin-block-end: 10px;
margin-inline-start: 10px;
margin-inline-end: 10px;
}
.element-two {
margin-block-start: 10px;
margin-block-end: 30px;
margin-inline-start: 40px;
margin-inline-end: 20px;
}
.element-three {
margin-inline-start: auto;
margin-inline-end: auto;
}