Espaciado
Actualiza tu distribución sin crear clases nuevas. Los auxiliares de espaciado son útiles para modificar el padding y el margin de un elemento
Playground
Use the playground to get a feel for what the different helper classes can do. For an explanation of how they work, see the How it works section below.
Cómo funciona
Aplica un margin o un pading a un elemento que va desde 0 hasta 5. Cada incremento de tamaño fue diseñado para respetar los espaciados comunes ed Material Design. Estas clases pueden ser aplicadas usando el siguiente formato: {propiedad}{dirección}-{tamaño}
.
La propiedad aplica el tipo de espaciado:
m
- aplica unmargin
p
- aplica unpadding
La dirección indica de qué lado se aplica el espaciado:
t
- aplica la propiedad demargin-top
opadding-top
b
- aplica la propiedad demargin-bottom
opadding-bottom
l
- aplica la propiedad demargin-left
opadding-left
r
- aplica la propiedad demargin-right
opadding-right
x
- aplica ambas propiedades*-left
y*-right
y
- aplica ambas propiedades*-top
y*-bottom
El tamaño controla los incrementos de la propiedad:
0
- quita elmargin
opadding
asignándoles el valor0
1
- aplica unmargin
opadding
con un valor de$spacer * .25
2
- aplica unmargin
opadding
con un valor de$spacer * .5
3
- aplica unmargin
opadding
con un valor de$spacer
4
- aplica unmargin
opadding
con un valor de$spacer * 1.5
5
- aplica unmargin
opadding
con un valor de$spacer * 3