divide-x-4

The divide-x-4 class belongs to the divide width group within the borders category.

Example Usage

Here is an example of how to use divide-x-4:

<div class='flex text-black bg-gray-100 divide-x-4  divide-solid divide-white'>
  <div>some</div>
  <div>content</div>
  <div>as</div>
  <div>demo</div>
</div>
some
content
as
demo

Resulting CSS

--tw-divide-x-reverse: 0;
border-right-width: calc(4px * var(--tw-divide-x-reverse));
border-left-width: calc(4px * calc(1 - var(--tw-divide-x-reverse)));

Other Divide width Classes

divide-x-0 divide-x-2 divide-x-4 divide-x-8 divide-y-0 divide-y-2 divide-y-4 divide-y-8 divide-y-reverse divide-x-reverse
View other Borders classes

Get Tailwind Scanner!

The absolute must-have tool for anyone using Tailwind CSS.

Scan, Edit, Export any tailwind site in browser to create the perfect UI - download the chrome extension!