| Clase | CSS | Ejemplo |
|---|---|---|
| static | position: static |
static
|
| relative | position: relative |
relative
|
| absolute | position: absolute |
absolute
|
| fixed | position: fixed |
fixed
|
| sticky | position: sticky |
sticky
Scroll aquÃ
|
| Clase | CSS | Ejemplo Visual |
|---|---|---|
| top-0 | top: 0 |
top-0
|
| top-4 | top: 1rem |
top-4
|
| -top-4 | top: -1rem |
-top-4
|
| top-1/2 | top: 50% |
top-1/2
|
| top-full | top: 100% |
top-full
|
| top-[20px] | top: 20px |
top-[20px]
|
| left-0 | left: 0 |
left-0
|
| left-4 | left: 1rem |
left-4
|
| -left-4 | left: -1rem |
-left-4
|
| left-1/2 | left: 50% |
left-1/2
|
| left-full | left: 100% |
left-full
|
| left-[20px] | left: 20px |
left-[20px]
|
| bottom-0 | bottom: 0 |
bottom-0
|
| bottom-4 | bottom: 1rem |
bottom-4
|
| -bottom-4 | bottom: -1rem |
-bottom-4
|
| bottom-1/2 | bottom: 50% |
bottom-1/2
|
| bottom-full | bottom: 100% |
bottom-full
|
| bottom-[20px] | bottom: 20px |
bottom-[20px]
|
| right-0 | right: 0 |
right-0
|
| right-4 | right: 1rem |
right-4
|
| -right-4 | right: -1rem |
-right-4
|
| right-1/2 | right: 50% |
right-1/2
|
| right-full | right: 100% |
right-full
|
| right-[20px] | right: 20px |
right-[20px]
|
|
Nota: Tanto el |
||
| inset-0 | inset: 0 |
inset-0
|
| inset-4 | inset: 1rem |
inset-4
|
| -inset-4 | inset: -1rem |
-inset-4
|
| inset-1/2 | inset: 50% |
inset-1/2
|
| inset-full | inset: 100% |
inset-full
|
| inset-[20px] | inset: 20px |
inset-[20px]
|