| Clase Tailwind | CSS equivalente | Ejemplo |
|---|---|---|
| divide-x | border-left-width: 1px en hijos |
Caja 1
Caja 2
Caja 3
|
| divide-x-2 | border-left-width: 2px en hijos |
Caja 1
Caja 2
Caja 3
|
| divide-x-4 | border-left-width: 2px en hijos |
Caja 1
Caja 2
Caja 3
|
| divide-y | border-top-width: 1px en hijos |
Fila 1
Fila 2
Fila 3
|
| divide-y-2 | border-top-width: 2px en hijos |
Fila 1
Fila 2
Fila 3
|
| divide-y-4 | border-top-width: 4px en hijos |
Fila 1
Fila 2
Fila 3
|
| divide-x-reverse | aplica inversión del orden visual |
A
B
C
|
|
A
B
C
|
||
|
A
B
C
|
||
| divide-y-reverse | aplica inversión del orden visual |
Fila 1
Fila 2
Fila 3
|
|
Fila 1
Fila 2
Fila 3
|
||
|
Fila 1
Fila 2
Fila 3
|
||
| divide-dashed | border-style: dashed; |
Caja A
Caja B
Caja C
|
| divide-green-500 | border-color: #22c55e; |
Caja A
Caja B
Caja C
|
| divide-[#ff00ff] | border-color: #ff00ff; |
Caja A
Caja B
Caja C
|
| divide-opacity-50 | border-opacity: 0.5; |
Caja A
Caja B
Caja C
|
| divide-pink-500/30 | border-color: rgba(236, 72, 153, 0.3); |
Caja A
Caja B
Caja C
|
| divide-x-[6px] | border-left-width: 6px en hijos |
Caja A
Caja B
Caja C
|