-
-
Notifications
You must be signed in to change notification settings - Fork 86
Closed
Labels
bugSomething isn't workingSomething isn't workingcontext-v3Related to tailwind-merge v3Related to tailwind-merge v3
Description
Describe the bug
The .gap-px utility is not merged with .gap-1 as expected when using tailwind-merge. Instead of resolving to a single gap utility, both classes remain, leading to potential styling conflicts.
To Reproduce
- Use
tailwind-mergeto process a class list that includes both.gap-pxand.gap-1. - Observe that both classes persist instead of
.gap-1taking precedence.
You can use the following CodeSandbox to reproduce the issue:
https://codesandbox.io/p/sandbox/suspicious-burnell-qx2z9k?file=%2Fsrc%2Findex.ts
Expected behavior
The .gap-1 utility should replace .gap-px in the final merged class list since it has a higher numerical value.
Environment
tailwind-mergeversion: 3.0.1- Runtime: Node.js 18
- Bundler: Parcel 1.12.5
- TypeScript: 4.4.4
- Browser: [e.g. Chrome 120, Firefox 118]
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't workingcontext-v3Related to tailwind-merge v3Related to tailwind-merge v3