tailwindcss
tailwindcss copied to clipboard
`bg-[10px_10%]` is missing background-size type checking
What version of Tailwind CSS are you using?
v3.1.8 or Insiders (4fddd2d)
What build tool (or framework if it abstracts the build tool) are you using?
tailwind cli
What version of Node.js are you using?
v16
What browser are you using?
N/A
What operating system are you using?
macOS
Reproduction URL
https://play.tailwindcss.com/tpx3OYFFsH
Describe your issue
As the Reproduction URL,
<div bg-[10px_10%]></div>
<div bg-[10%_10%]></div>
<div bg-[10px_10px]></div>
can generate
.bg-\[10px_10\%\] {
background-position: 10px 10%;
}
which does not make sense, because all these values are valid (background-size and background-position) so it's ambiguous.
I've created a PR to solve this problem. https://github.com/tailwindlabs/tailwindcss/pull/9349