How to write some unusual styles

[ghost]

What version of @tailwindcss/jit are you using?

0.1.18

What version of Node.js are you using?

14.16.0

What build tool (or framework if it abstracts the build tool) are you using?

postcss-cli 8.3.1

What browser are you using?

Chrome

What operating system are you using?

macOS

Reproduction repository

https://github.com/awnawnawn/awnawnawn.github.io

I want to give it to div style to transform-style: preserve-3d and transition-delay: 0ms

<div class="mt-[123px] transform-style-[preserve-3d] delay-[0] mb-[321px]"></div>

After compilation

.mt-\[123px\] {
	margin-top: 123px;
}
.mb-\[321px\] {
	margin-bottom: 321px;
}

How should I write it ?

[jrmajor]

Tailwind doesn't have transform-style utilities, so transform-style-[preserve-3d] won't work. You can write a custom utility class for that.

Arbitrary values are not supported for delay utility yet. Also, the syntax would probably be delay-[0ms].

[jrmajor]

Update: I've created a PR with support for delay-[0ms] (tailwindlabs/tailwindcss-jit#209).

I think this issue can be closed.